{lotusTerminal && (
@@ -57,6 +145,9 @@ function GifPickerInner({ onSelect, requestClose, lotusTerminal }: GifPickerInne
+ {showRecents && (
+
+ )}
null,
+ setItem: () => undefined,
+ removeItem: () => undefined,
+};
+
+const { addRecentGif } = await import('./recentGifs');
+
+const gif = (url: string, width = 100, height = 100) => ({ url, width, height });
+
+test('addRecentGif prepends a new gif', () => {
+ const out = addRecentGif([gif('a'), gif('b')], gif('c'));
+ assert.deepEqual(
+ out.map((g) => g.url),
+ ['c', 'a', 'b'],
+ );
+});
+
+test('addRecentGif de-dupes by url, moving the entry to the front', () => {
+ const out = addRecentGif([gif('a'), gif('b'), gif('c')], gif('b'));
+ assert.deepEqual(
+ out.map((g) => g.url),
+ ['b', 'a', 'c'],
+ );
+});
+
+test('addRecentGif ignores an empty url', () => {
+ assert.deepEqual(addRecentGif([gif('a')], gif('')), [gif('a')]);
+});
+
+test('addRecentGif caps the list at 16, dropping the oldest', () => {
+ const sixteen = Array.from({ length: 16 }, (_, i) => gif(`u${i}`));
+ const out = addRecentGif(sixteen, gif('new'));
+ assert.equal(out.length, 16);
+ assert.equal(out[0].url, 'new');
+ assert.equal(
+ out.some((g) => g.url === 'u15'),
+ false,
+ );
+});
+
+test('addRecentGif does not mutate its input', () => {
+ const input = [gif('a'), gif('b')];
+ const before = input.map((g) => g.url);
+ addRecentGif(input, gif('c'));
+ assert.deepEqual(
+ input.map((g) => g.url),
+ before,
+ );
+});
diff --git a/src/app/state/recentGifs.ts b/src/app/state/recentGifs.ts
new file mode 100644
index 000000000..b5706e30f
--- /dev/null
+++ b/src/app/state/recentGifs.ts
@@ -0,0 +1,48 @@
+import { atom } from 'jotai';
+import { atomWithStorage, createJSONStorage } from 'jotai/utils';
+
+export type RecentGif = {
+ url: string;
+ width: number;
+ height: number;
+};
+
+const STORAGE_KEY = 'cinny_recent_gifs_v1';
+const MAX_RECENT_GIFS = 16;
+
+// getOnInit reads localStorage synchronously so the Recent row is present on the
+// first render of the GIF picker (no flash of the empty default).
+const internalAtom = atomWithStorage(
+ STORAGE_KEY,
+ [],
+ createJSONStorage(() => localStorage),
+ { getOnInit: true },
+);
+
+/**
+ * Global atom: the most recently sent GIFs, newest first, deduped by url, capped
+ * at MAX_RECENT_GIFS. Backed by localStorage (device-local convenience).
+ */
+export const recentGifsAtom = atom(
+ (get): RecentGif[] => get(internalAtom),
+ (_get, set, updater: RecentGif[] | ((prev: RecentGif[]) => RecentGif[])) => {
+ set(internalAtom, (prev) => {
+ const prevList = Array.isArray(prev) ? prev : [];
+ return typeof updater === 'function' ? updater(prevList) : updater;
+ });
+ },
+);
+
+/**
+ * Prepend a GIF: ignores an empty url, de-dupes by url (moving an existing entry
+ * to the front), and caps the list at `max`. Pure — returns a new array.
+ */
+export const addRecentGif = (
+ prev: RecentGif[],
+ gif: RecentGif,
+ max = MAX_RECENT_GIFS,
+): RecentGif[] => {
+ if (!gif.url) return prev;
+ const withoutDupe = prev.filter((g) => g.url !== gif.url);
+ return [gif, ...withoutDupe].slice(0, max);
+};