import type { Bookmark } from "@markone/core/bookmark"
import { create } from "zustand/react"
import { router } from "~/router"
import { BookmarkListItemAction } from "./-bookmark-list"

enum LayoutMode {
	Popup = "Popup",
	SideBySide = "SideBySide",
}

enum ActiveDialog {
	None = "None",
	AddBookmark = "AddBookmark",
	DeleteBookmark = "DeleteBookmark",
}

interface BookmarkPageState {
	bookmarkToBeDeleted: Bookmark | null
	layoutMode: LayoutMode
	activeDialog: ActiveDialog

	handleBookmarkListItemAction: (bookmark: Bookmark, action: BookmarkListItemAction) => void
	setActiveDialog: (dialog: ActiveDialog) => void
	setLayoutMode: (mode: LayoutMode) => void
}

const useBookmarkPageStore = create<BookmarkPageState>()((set, get) => ({
	bookmarkCount: 0,
	bookmarks: [],
	selectedBookmarkId: "",
	selectedBookmarkIndex: 0,
	isBookmarkItemExpanded: false,
	isBookmarkPreviewOpened: false,
	bookmarkToBeDeleted: null,
	layoutMode: LayoutMode.Popup,
	activeDialog: ActiveDialog.None,
	actionBarHeight: 0,

	handleBookmarkListItemAction(bookmark: Bookmark, action: BookmarkListItemAction) {
		switch (action) {
			case BookmarkListItemAction.Open:
				router.navigate({ to: `/bookmarks/${bookmark.id}` })
				break

			case BookmarkListItemAction.Delete:
				set({ bookmarkToBeDeleted: bookmark, activeDialog: ActiveDialog.DeleteBookmark })
				break
			default:
				break
		}
	},

	setActiveDialog(dialog: ActiveDialog) {
		set({ activeDialog: dialog })
	},

	setLayoutMode(mode: LayoutMode) {
		set({ layoutMode: mode })
	},
}))

export { LayoutMode, ActiveDialog, useBookmarkPageStore }
export type { BookmarkPageState }