fix build issues

.vitepress/config.mts

@@ -1,10 +1,10 @@
+import { fileURLToPath } from "node:url";
 import { defineConfig } from "vitepress";
 import { withPwa } from "@vite-pwa/vitepress";
 import UnoCSS from "unocss/vite";
 import { presetUno, presetAttributify, presetIcons } from "unocss";
-import { commitRef, meta } from "./constants";
+import { commitRef, meta, socials } from "./constants";
 import { pwa } from "./pwa";
-import { fileURLToPath } from "url";
 import { generateImages, generateMeta } from "./hooks";
 import { toggleStarredPlugin } from "./markdown/toggleStarred";
 import { base64DecodePlugin } from "./markdown/base64";
@@ -43,6 +43,17 @@ export default defineConfig({
   vite: {
     plugins: [
       UnoCSS({
+        theme: {
+          colors: {
+            primary: "var(--vp-c-brand-1)",
+            bg: "var(--vp-c-bg)",
+            "bg-alt": "var(--vp-c-bg-alt)",
+            "bg-elv": "var(--vp-c-bg-elv)",
+            text: "var(--vp-c-text-1)",
+            "text-2": "var(--vp-c-text-2)",
+            div: "var(--vp-c-divider)",
+          },
+        },
         presets: [
           presetUno(),
           presetAttributify(),
@@ -58,7 +69,7 @@ export default defineConfig({
     ],
     build: {
       // Shut the fuck up
-      chunkSizeWarningLimit: Infinity,
+      chunkSizeWarningLimit: Number.POSITIVE_INFINITY,
     },
     resolve: {
       alias: [
@@ -80,7 +91,7 @@ export default defineConfig({
   themeConfig: {
     search: {
       options: {
-        miniSearch: { searchOptions: {combineWith: "AND"} },
+        miniSearch: { searchOptions: { combineWith: "AND" } },
         detailedView: true,
       },
       provider: "local",
@@ -119,16 +130,7 @@ export default defineConfig({
       { text: "🔑 Base64", link: "/base64" },
       { text: "📦 Storage", link: "/storage" },
     ],
-    socialLinks: [
+    socialLinks: socials,
-      { icon: "github", link: "https://github.com/fmhy/FMHYEdit" },
-      { icon: "discord", link: "https://discord.gg/Stz6y6NgNg" },
-      {
-        icon: {
-          svg: '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12a12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547l-.8 3.747c1.824.07 3.48.632 4.674 1.488c.308-.309.73-.491 1.207-.491c.968 0 1.754.786 1.754 1.754c0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87c-3.874 0-7.004-2.176-7.004-4.87c0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754c.463 0 .898.196 1.207.49c1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 0 1 .14-.197a.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248c.687 0 1.248-.561 1.248-1.249c0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25c0 .687.561 1.248 1.249 1.248c.688 0 1.249-.561 1.249-1.249c0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094a.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913c.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463a.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73c-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z"/></svg>',
-        },
-        link: "https://reddit.com/r/FREEMEDIAHECKYEAH",
-      },
-    ],
     ...pwa,
   },
 });

.vitepress/constants.ts

@@ -1,8 +1,9 @@
+import type { DefaultTheme } from "vitepress";
+
 export const meta = {
   name: "FreeMediaHeckYeah",
-  description:
+  description: "The largest collection of free stuff on the internet!",
-    "The largest collection of free stuff on the internet!",
+  hostname: process.env.CF_PAGES ? "https://fmhy.pages.dev" : "https://fmhy.netlify.app",
-  hostname: process.env.COMMIT_REF ? "https://fmhy.netlify.app" : "https://fmhy.pages.dev",
   keywords: ["stream", "movies", "gaming", "reading", "anime"],
 };
 
@@ -10,7 +11,19 @@ export const meta = {
 export const commitRef = process.env.COMMIT_REF
   ? `<a href="https://github.com/fmhy/FMHYEdit/commit/${process.env.COMMIT_REF
   }">${process.env.COMMIT_REF.slice(0, 8)}</a>`
-  : process.env.CF_PAGES_COMMIT_SHA
+  : process.env.CF_PAGES
     ? `<a href="https://github.com/fmhy/FMHYEdit/commit/${process.env.CF_PAGES_COMMIT_SHA
     }">${process.env.CF_PAGES_COMMIT_SHA.slice(0, 8)}</a>`
     : "dev";
+
+export const socials: DefaultTheme.SocialLink[] = [
+  { icon: "github", link: "https://github.com/fmhy/FMHYEdit" },
+  { icon: "discord", link: "https://discord.gg/Stz6y6NgNg" },
+  {
+    icon: {
+      svg: '<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12a12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547l-.8 3.747c1.824.07 3.48.632 4.674 1.488c.308-.309.73-.491 1.207-.491c.968 0 1.754.786 1.754 1.754c0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87c-3.874 0-7.004-2.176-7.004-4.87c0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754c.463 0 .898.196 1.207.49c1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 0 1 .14-.197a.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248c.687 0 1.248-.561 1.248-1.249c0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25c0 .687.561 1.248 1.249 1.248c.688 0 1.249-.561 1.249-1.249c0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094a.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913c.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463a.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73c-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z"/></svg>',
+    },
+    ariaLabel: "Reddit",
+    link: "https://reddit.com/r/FREEMEDIAHECKYEAH",
+  },
+];

.vitepress/theme/components/Feedback.vue

@@ -2,6 +2,7 @@
 import { reactive, ref } from "vue";
 import { useRoute } from "vitepress";
 import type { FeedbackType } from "../../types/Feedback";
+import { fetcher } from "itty-fetcher";
 
 const loading = ref<boolean>(false);
 const error = ref<unknown>(null);
@@ -69,18 +70,21 @@ async function handleSubmit(type?: FeedbackType["type"]) {
     <Transition name="fade" mode="out-in">
       <div v-if="!feedback.type" class="step">
         <div>
-                  <div>
+          <div>
             <p class="heading">Feedback</p>
           </div>
         </div>
         <div class="button-container">
-          <button v-for="item in feedbackOptions" :key="item.value" class="btn"
+          <button
+            v-for="item in feedbackOptions"
+            :key="item.value"
+            class="btn"
             @click="handleSubmit(item.value as FeedbackType['type'])">
             <span>{{ item.label }}</span>
-                 </button>
+          </button>
         </div>
       </div>
-       <div v-else-if="feedback.type && !success" class="step">
+      <div v-else-if="feedback.type && !success" class="step">
         <div>
           <p class="desc">The wiki is... • {{ path }}</p>
           <div>
@@ -88,12 +92,16 @@ async function handleSubmit(type?: FeedbackType["type"]) {
             <button style="margin-left: 0.5rem" class="btn" @click="feedback.type = undefined">
               <span class="i-carbon-close-large">close</span>
             </button>
-              </div>
+          </div>
         </div>
         <textarea v-model="feedback.message" autofocus class="input" />
         <p class="desc">Contacts, so we can get back to you. (Optional)</p>
         <textarea v-model="feedback.contact" class="contact-input" />
-        <button type="submit" class="btn btn-primary" :disabled="feedback.message.length > 1000" @click="handleSubmit()">
+        <button
+          type="submit"
+          class="btn btn-primary"
+          :disabled="feedback.message.length > 10"
+          @click="handleSubmit()">
           Submit
         </button>
       </div>
@@ -105,7 +113,7 @@ async function handleSubmit(type?: FeedbackType["type"]) {
 </template>
 
 <style scoped>
-.step>*+* {
+.step > * + * {
   margin-top: 1rem;
 }
 

.vitepress/theme/components/Feedback2.vue

@@ -0,0 +1,132 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import {
+  TransitionRoot,
+  TransitionChild,
+  Dialog,
+  DialogPanel,
+  DialogTitle,
+  DialogDescription,
+} from "@headlessui/vue";
+
+const isOpen = ref(true);
+interface ILogger {
+
+}
+
+const feedbackOptions = [
+  {
+    label: "♻️ Suggestion",
+    value: "suggestion",
+  },
+  {
+    label: "❤️ Appreciation",
+    value: "appreciate",
+  },
+  { label: "🐞 Bug", value: "bug" },
+  { label: "📂 Other", value: "other" },
+];
+
+function closeModal() {
+  isOpen.value = false;
+}
+function openModal() {
+  isOpen.value = true;
+}
+</script>
+
+<template>
+  <button type="button" class="p-[4px 8px] text-xl i-carbon:user-favorite-alt-filled" @click="openModal" />
+
+  <TransitionRoot appear :show="isOpen" as="template">
+    <Dialog as="div" @close="closeModal" class="relative z-10">
+      <TransitionChild as="template" enter="duration-300 ease-out" enter-from="opacity-0" enter-to="opacity-100"
+        leave="duration-200 ease-in" leave-from="opacity-100" leave-to="opacity-0">
+        <div class="fixed inset-0 bg-black/25" />
+      </TransitionChild>
+
+      <div class="fixed inset-0 overflow-y-auto">
+        <div class="flex min-h-full items-center justify-center p-4 text-center">
+          <TransitionChild as="template" enter="duration-300 ease-out" enter-from="opacity-0 scale-95"
+            enter-to="opacity-100 scale-100" leave="duration-200 ease-in" leave-from="opacity-100 scale-100"
+            leave-to="opacity-0 scale-95">
+            <DialogPanel
+              class="w-full max-w-md transform overflow-hidden rounded-2xl bg-bg p-6 text-left align-middle shadow-xl transition-all">
+              <DialogTitle as="h3" class="text-lg font-medium leading-6 text-text">
+                Feedback
+              </DialogTitle>
+
+              <div class="mt-2">
+                <div class="grid gap-[0.5rem]">
+                  <button v-for="item in feedbackOptions" :key="item.value"
+                    class="inline-flex justify-center rounded-md border border-transparent bg-bg-alt px-4 py-2 text-sm font-medium text-text hover:border-primary focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2">
+                    <span>{{ item.label }}</span>
+                  </button>
+                </div>
+              </div>
+
+                <div class="mt-2">
+                  <div>
+                    <label for="feedback-input-text" class="field-label">Feedback*</label>
+
+                    <textarea id="feedback-input-text" placeholder="meow" rows="5" />
+                  </div>
+              </div>
+
+              <div class="mt-4">
+                <button type="button"
+                  class="inline-flex justify-center rounded-md border border-transparent bg-blue-100 px-4 py-2 text-sm font-medium text-blue-900 hover:bg-blue-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"
+                  @click="closeModal">
+                  Close
+                </button>
+              </div>
+            </DialogPanel>
+          </TransitionChild>
+        </div>
+      </div>
+    </Dialog>
+  </TransitionRoot>
+</template>
+
+<style scoped>
+textarea,
+input {
+  font-family: var(--vp-font-family-base);
+  background: var(--vp-c-bg-soft);
+  font-size: 14px;
+  border-radius: 4px;
+  padding: 16px;
+  width: 100%;
+
+  &::placeholder {
+    color: var(--vp-c-text-2) !important;
+    opacity: 1;
+  }
+}
+
+.btn {
+  border: 1px solid var(--vp-c-divider);
+  background-color: var(--vp-c-bg);
+  border-radius: 8px;
+  transition:
+    border-color 0.25s,
+    background-color 0.25s;
+  display: inline-block;
+  font-size: 14px;
+  font-weight: 500;
+  line-height: 1.5;
+  margin: 0;
+  padding: 0.375rem 0.75rem;
+  text-align: center;
+  vertical-align: middle;
+  white-space: nowrap;
+}
+
+.btn:disabled {
+  opacity: 0.5;
+}
+
+.btn:hover {
+  border-color: var(--vp-c-brand);
+}
+</style>

DEVTools.md

@@ -67,7 +67,7 @@
 * [Curated Programming Resources](https://github.com/Michael0x2a/curated-programming-resources) - Programming Courses
 * [Stack Exchange](https://stackexchange.com/) - Programming Q&A / [App](https://play.google.com/store/apps/details?id=me.tylerbwong.stack)
 * [Learn X in Y minutes](https://learnxinyminutes.com/), [2](https://github.com/adambard/learnxinyminutes-docs) - Programming Language Rundowns
-* [HEAD](https://htmlhead.dev/) - HTML `<head>` Element Guide
+* [HEAD](https://htmlhead.dev/) - HTML head Element Guide
 * [Typing.io](https://typing.io/) - Typing Practice for Programmers 
 * [Karel The Robot](https://github.com/fredoverflow/karel) - Basic Programming Teaching Environment
 * [Project Based Learning](https://github.com/practical-tutorials/project-based-learning) - Collection of Project-Based Tutorials
@@ -754,7 +754,7 @@
 * [Codux](https://www.codux.com/) - Visual IDE for React
 * [React95](https://react95.io/) - Windows 95 React Components
 * [React SVG](https://react-svgr.com/playground/) - Convert SVG to React Components
-* [Zorm](https://github.com/esamattis/react-zorm) - Type-safe `<form>` for React
+* [Zorm](https://github.com/esamattis/react-zorm) - Type-safe form for React
 * [Million](https://github.com/aidenybai/million) - React Replacement
 * [novu](https://novu.co/) - Real-Time React Notifications / [GitHub](https://github.com/novuhq/novu)
 * [React Use](https://github.com/streamich/react-use) - React Hooks 

eslint.config.js

@@ -0,0 +1,6 @@
+// @ts-check
+import tasky from "@taskylizard/eslint-config";
+
+export default tasky({
+  vue: true,
+});

package.json

@@ -12,6 +12,7 @@
     "api:preview": "node .output/server/index.mjs",
     "og:dev": "x-satori -t ./.vitepress/hooks/Template.vue -c ./.vitepress/hooks/satoriConfig.ts --dev",
     "format": "prettier -w --cache .",
+    "lint": "eslint .vitepress -f pretty --cache",
     "postinstall": "nitropack prepare"
   },
   "dependencies": {
@@ -32,8 +33,10 @@
   "devDependencies": {
     "@iconify-json/carbon": "^1.1.21",
     "@iconify-json/twemoji": "^1.1.12",
+    "@taskylizard/eslint-config": "^1.0.1",
     "@types/node": "^20.8.9",
     "@vite-pwa/vitepress": "^0.2.3",
+    "eslint": "^8.53.0",
     "prettier": "^3.0.3"
   },
   "pnpm": {