feature(web): Allow changing the bookmark grid layout (#98)

1 files changed, 37 insertions, 0 deletions

diff --git a/apps/web/lib/userLocalSettings/bookmarksLayout.tsx b/apps/web/lib/userLocalSettings/bookmarksLayout.tsx
new file mode 100644
index 00000000..424046b9
--- /dev/null
+++ b/apps/web/lib/userLocalSettings/bookmarksLayout.tsx
@@ -0,0 +1,37 @@
+"use client";
+
+import type { z } from "zod";
+import { createContext, useContext } from "react";
+
+import type { BookmarksLayoutTypes, zUserLocalSettings } from "./types";
+
+const defaultLayout: BookmarksLayoutTypes = "masonry";
+
+export const UserLocalSettingsCtx = createContext<
+  z.infer<typeof zUserLocalSettings>
+>({
+  bookmarkGridLayout: defaultLayout,
+});
+
+function useUserLocalSettings() {
+  return useContext(UserLocalSettingsCtx);
+}
+
+export function useBookmarkLayout() {
+  const settings = useUserLocalSettings();
+  return settings.bookmarkGridLayout;
+}
+
+export function bookmarkLayoutSwitch<T>(
+  layout: BookmarksLayoutTypes,
+  data: Record<BookmarksLayoutTypes, T>,
+) {
+  return data[layout];
+}
+
+export function useBookmarkLayoutSwitch<T>(
+  data: Record<BookmarksLayoutTypes, T>,
+) {
+  const layout = useBookmarkLayout();
+  return data[layout];
+}