memorium/islands/KMenu/commands.ts

import { Menu } from "@islands/KMenu/types.ts";
import { Movie } from "@lib/resource/movies.ts";
import { TMDBMovie } from "@lib/types.ts";
import { fetchStream, isValidUrl } from "@lib/helpers.ts";

export const menus: Record<string, Menu> = {
  main: {
    title: "Run",
    entries: [
      {
        title: "Close menu",
        meta: "",
        cb: (state) => {
          state.visible.value = false;
        },
        visible: () => false,
      },
      {
        title: "Create new article",
        meta: "",
        icon: "IconSquareRoundedPlus",
        cb: (state) => {
          state.menus["input_link"] = {
            title: "Link:",
            entries: [],
          };

          state.activeMenu.value = "input_link";
          state.activeState.value = "input";

          const unsub = state.commandInput.subscribe((value) => {
            if (isValidUrl(value)) {
              unsub();

              state.activeState.value = "loading";

              fetchStream("/api/articles/create?url=" + value, (chunk) => {
                console.log({ chunk: chunk.split("\n") });
                if (chunk.startsWith("id:")) {
                  state.loadingText.value = "Finished";
                  setTimeout(() => {
                    window.location.href = "/articles/" +
                      chunk.replace("id:", "").trim();
                  }, 500);
                } else {
                  state.loadingText.value = chunk;
                }
              });
            }
          });
        },
        visible: () => true,
      },
      {
        title: "Clear Cache",
        icon: "IconRefresh",
        cb: async (state) => {
          state.activeState.value = "loading";
          await fetch("/api/cache", {
            method: "DELETE",
          });
          state.activeState.value = "normal";
          state.visible.value = false;
        },
      },
      {
        title: "Add Movie infos",
        meta: "",
        icon: "IconReportSearch",
        cb: async (state, context) => {
          state.activeState.value = "loading";
          const movie = context as Movie;

          const query = movie.name;

          const response = await fetch(
            `/api/tmdb/query?q=${encodeURIComponent(query)}`,
          );

          const json = await response.json() as TMDBMovie[];

          const menuID = `result/${movie.name}`;

          state.menus[menuID] = {
            title: "Select",
            entries: json.map((m) => ({
              title: `${m.title} released ${m.release_date}`,
              cb: async () => {
                state.activeState.value = "loading";
                await fetch(`/api/movies/enhance/${movie.name}/`, {
                  method: "POST",
                  body: JSON.stringify({ tmdbId: m.id }),
                });
                state.visible.value = false;
                state.activeState.value = "normal";
                window.location.reload();
              },
            })),
          };

          state.activeMenu.value = menuID;

          state.activeState.value = "normal";
        },
        visible: () => {
          const loc = globalThis["location"];
          return loc?.pathname?.includes("movie");
        },
      },
      {
        title: "Reload Page",
        meta: "",
        cb: () => {
          window.location.reload();
        },
        visible: () => false,
      },
    ],
  },
};