Revert TypeScript migration - keep JS/JSX

eslint.config.js

@@ -1,6 +1,5 @@
 import globals from "globals";
-import tseslint from "@typescript-eslint/eslint-plugin";
-import tsParser from "@typescript-eslint/parser";
+import pluginVue from "eslint-plugin-vue";
 
 export default [
   {
@@ -12,32 +11,22 @@ export default [
       "build/**",
     ],
   },
+  ...pluginVue.configs["flat/essential"],
   {
-    files: ["**/*.{ts,tsx}"],
     languageOptions: {
-      parser: tsParser,
-      parserOptions: {
-        ecmaVersion: "latest",
-        sourceType: "module",
-        ecmaFeatures: {
-          jsx: true,
-        },
-      },
       globals: {
         ...globals.browser,
         ...globals.node,
+        Alpine: "readonly",
+        $: "readonly",
+        jQuery: "readonly",
       },
     },
-    plugins: {
-      "@typescript-eslint": tseslint,
-    },
     rules: {
       "no-console": "warn",
       "no-debugger": "warn",
-      "@typescript-eslint/no-unused-vars": [
-        "warn",
-        { argsIgnorePattern: "^_" },
-      ],
+      "vue/multi-word-component-names": "off",
+      "vue/no-v-html": "off",
     },
   },
 ];

package.json

@@ -8,17 +8,16 @@
     "build:atom": "vite build --config resources/themes/atom/vite.config.js && php artisan optimize:clear && php artisan optimize && chown -R www-data:www-data public/build",
     "build:dusk": "vite build --config resources/themes/dusk/vite.config.js && php artisan optimize:clear && php artisan optimize && chown -R www-data:www-data public/build",
     "build:all": "vite build --config resources/themes/atom/vite.config.js && vite build --config resources/themes/dusk/vite.config.js && php artisan optimize:clear && php artisan optimize && chown -R www-data:www-data public/build",
-    "typecheck": "tsc --noEmit",
     "preview": "vite preview",
-    "format": "prettier \"resources/**/*.{js,ts,tsx,vue,blade}\" --ignore-unknown --write",
-    "format:check": "prettier \"resources/**/*.{js,ts,tsx,vue,blade.php}\" --check",
-    "lint": "eslint \"resources/js/\" --ext .ts,.tsx",
-    "lint:fix": "eslint \"resources/js/\" --ext .ts,.tsx --fix",
+    "format": "prettier \"resources/**/*.{js,ts,vue,blade}\" --ignore-unknown --write",
+    "format:check": "prettier \"resources/**/*.{js,ts,vue,blade.php}\" --check",
+    "lint": "eslint resources/js/",
+    "lint:fix": "eslint resources/js/ --fix",
     "lint:css": "stylelint \"resources/**/*.css\"",
     "lint:css:fix": "stylelint \"resources/**/*.css\" --fix",
     "lint:all": "yarn lint && yarn lint:css",
     "lint:fix:all": "yarn lint:fix && yarn lint:fix:css",
-    "check": "yarn typecheck && yarn lint:all && yarn format:check",
+    "check": "yarn lint:all && yarn format:check",
     "check:php": "php -l app/ && php -l routes/ && php -l database/ && php -l resources/",
     "check:security": "composer audit && npm audit",
     "check:deps": "npm outdated --long --json || true",
@@ -34,17 +33,12 @@
     "@tailwindcss/forms": "0.5.11",
     "@tailwindcss/postcss": "4.3.0",
     "@tailwindcss/typography": "0.5.19",
-    "@types/lodash": "^4.17.24",
-    "@types/react": "^19.2.17",
-    "@types/react-dom": "^19.2.3",
-    "@typescript-eslint/eslint-plugin": "^8.61.1",
-    "@typescript-eslint/parser": "^8.61.1",
     "alpinejs": "3.15.12",
     "autoprefixer": "10.5.0",
     "axios": "^1.17.0",
     "esbuild": "^0.28.0",
     "eslint": "^10.4.1",
-    "globals": "^17.6.0",
+    "eslint-plugin-vue": "10.9.2",
     "laravel-vite-plugin": "^3.1.0",
     "lodash": "^4.18.1",
     "postcss": "8.5.15",
@@ -55,7 +49,6 @@
     "stylelint-config-standard": "^40.0.0",
     "tailwindcss": "4.3.0",
     "turbolinks": "5.2.0",
-    "typescript": "^6.0.3",
     "vite": "^8.0.16"
   },
   "dependencies": {

public/build/manifest.json

@@ -1,26 +1,15 @@
 {
-  "_axios-BEkq_c61.js": {
-    "file": "assets/axios-BEkq_c61.js",
+  "_axios-Bb9VWCvi.js": {
+    "file": "assets/axios-Bb9VWCvi.js",
     "name": "axios",
     "imports": [
-      "_chunk-b3L32Ng1.js"
+      "_chunk-QTnfLwEv.js"
     ]
   },
-  "_chunk-b3L32Ng1.js": {
-    "file": "assets/chunk-b3L32Ng1.js",
+  "_chunk-QTnfLwEv.js": {
+    "file": "assets/chunk-QTnfLwEv.js",
     "name": "chunk"
   },
-  "_swiper-Cjlszzo3.js": {
-    "file": "assets/swiper-Cjlszzo3.js",
-    "name": "swiper",
-    "css": [
-      "assets/swiper-CrMA9oas.css"
-    ]
-  },
-  "_swiper-CrMA9oas.css": {
-    "file": "assets/swiper-CrMA9oas.css",
-    "src": "_swiper-CrMA9oas.css"
-  },
   "public/assets/images/background-dark.jpg": {
     "file": "assets/background-dark-BfkMu3-0.jpg",
     "src": "public/assets/images/background-dark.jpg"
@@ -29,18 +18,6 @@
     "file": "assets/background-light-CP7oKwVT.jpg",
     "src": "public/assets/images/background-light.jpg"
   },
-  "public/assets/images/dusk/background_image.png": {
-    "file": "assets/background_image-BH7pVpv1.png",
-    "src": "public/assets/images/dusk/background_image.png"
-  },
-  "public/assets/images/dusk/leaderboard_circle_image.png": {
-    "file": "assets/leaderboard_circle_image-BYkDVX69.png",
-    "src": "public/assets/images/dusk/leaderboard_circle_image.png"
-  },
-  "public/assets/images/dusk/store_icon.png": {
-    "file": "assets/store_icon-B52tsSKO.png",
-    "src": "public/assets/images/dusk/store_icon.png"
-  },
   "public/assets/images/icons/article.gif": {
     "file": "assets/article-CYhGsSKA.gif",
     "src": "public/assets/images/icons/article.gif"
@@ -134,7 +111,7 @@
     "src": "public/assets/images/profile/profile-bg.png"
   },
   "resources/css/global.css": {
-    "file": "assets/global-CwMfkl9f.css",
+    "file": "assets/global-DmKtm1TC.css",
     "name": "global",
     "names": [
       "global.css"
@@ -169,27 +146,27 @@
       "assets/community-Do_t1zw9.png"
     ]
   },
-  "resources/js/global.ts": {
-    "file": "assets/global-B6tm4RcQ.js",
+  "resources/js/global.js": {
+    "file": "assets/global-r22-sRCc.js",
     "name": "global",
-    "src": "resources/js/global.ts",
+    "src": "resources/js/global.js",
     "isEntry": true,
     "imports": [
-      "_chunk-b3L32Ng1.js",
-      "_axios-BEkq_c61.js"
+      "_chunk-QTnfLwEv.js",
+      "_axios-Bb9VWCvi.js"
     ]
   },
-  "resources/js/ssr.tsx": {
-    "file": "assets/ssr-GVDc-G73.js",
+  "resources/js/ssr.jsx": {
+    "file": "assets/ssr-DdmZbD73.js",
     "name": "ssr",
-    "src": "resources/js/ssr.tsx",
+    "src": "resources/js/ssr.jsx",
     "isEntry": true,
     "imports": [
-      "_chunk-b3L32Ng1.js"
+      "_chunk-QTnfLwEv.js"
     ]
   },
   "resources/themes/atom/css/app.css": {
-    "file": "assets/app-BPKvU7LK.css",
+    "file": "assets/app-DtTGSxkD.css",
     "name": "app",
     "names": [
       "app.css"
@@ -224,56 +201,17 @@
       "assets/community-Do_t1zw9.png"
     ]
   },
-  "resources/themes/atom/js/app.ts": {
-    "file": "assets/app-evCrhLY1.js",
+  "resources/themes/atom/js/app.js": {
+    "file": "assets/app-CAkt-7PZ.js",
     "name": "app",
-    "src": "resources/themes/atom/js/app.ts",
+    "src": "resources/themes/atom/js/app.js",
     "isEntry": true,
     "imports": [
-      "_chunk-b3L32Ng1.js",
-      "_swiper-Cjlszzo3.js",
-      "_axios-BEkq_c61.js"
-    ]
-  },
-  "resources/themes/dusk/css/app.css": {
-    "file": "assets/app-CHSILL1f.css",
-    "name": "app",
-    "names": [
-      "app.css"
-    ],
-    "src": "resources/themes/dusk/css/app.css",
-    "isEntry": true,
-    "assets": [
-      "assets/background_image-BH7pVpv1.png",
-      "assets/feeds-BtHcJdHX.png",
-      "assets/chat-r5H1PnTg.png",
-      "assets/article-CYhGsSKA.gif",
-      "assets/lighthouse-BON6qnQ0.png",
-      "assets/store_icon-B52tsSKO.png",
-      "assets/catalog-D-956oDx.png",
-      "assets/inventory-BlHYLNGT.png",
-      "assets/due-chat-CeO4yxLu.png",
-      "assets/friends-BxpcKlvz.png",
-      "assets/credits-Dpg5Nmby.png",
-      "assets/duckets-CaGJI1Oy.png",
-      "assets/diamonds-BtfqKoQu.png",
-      "assets/trophy-gold-bbKmpkii.png",
-      "assets/trophy-silver-bGfHJkQ_.png",
-      "assets/trophy-bronze-CgV5j1MU.png",
-      "assets/leaderboard_circle_image-BYkDVX69.png"
-    ]
-  },
-  "resources/themes/dusk/js/app.ts": {
-    "file": "assets/app-DKy1JARZ.js",
-    "name": "app",
-    "src": "resources/themes/dusk/js/app.ts",
-    "isEntry": true,
-    "imports": [
-      "_swiper-Cjlszzo3.js",
-      "_axios-BEkq_c61.js"
+      "_chunk-QTnfLwEv.js",
+      "_axios-Bb9VWCvi.js"
     ],
     "css": [
-      "assets/app-DU8Y3NnC.css"
+      "assets/app-CeYfhhVD.css"
     ]
   }
 }

resources/js/bootstrap.js

@@ -0,0 +1,34 @@
+import _ from "lodash";
+window._ = _;
+
+/**
+ * We'll load the axios HTTP library which allows us to easily issue requests
+ * to our Laravel back-end. This library automatically handles sending the
+ * CSRF token as a header based on the value of the "XSRF" token cookie.
+ */
+
+import axios from "axios";
+window.axios = axios;
+
+window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
+
+/**
+ * Echo exposes an expressive API for subscribing to channels and listening
+ * for events that are broadcast by Laravel. Echo and event broadcasting
+ * allows your team to easily build robust real-time web applications.
+ */
+
+// import Echo from 'laravel-echo';
+
+// import Pusher from 'pusher-js';
+// window.Pusher = Pusher;
+
+// window.Echo = new Echo({
+//     broadcaster: 'pusher',
+//     key: import.meta.env.VITE_PUSHER_APP_KEY,
+//     wsHost: import.meta.env.VITE_PUSHER_HOST ?? `ws-${import.meta.env.VITE_PUSHER_APP_CLUSTER}.pusher.com`,
+//     wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
+//     wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
+//     forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
+//     enabledTransports: ['ws', 'wss'],
+// });

resources/js/bootstrap.ts

@@ -1,6 +0,0 @@
-import _ from "lodash";
-import axios from "axios";
-
-window._ = _;
-window.axios = axios;
-window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";

resources/js/pages/Home.jsx

@@ -0,0 +1,31 @@
+import { Head } from '@inertiajs/react'
+
+export default function Home({ auth, hotelName }) {
+  return (
+    <>
+      <Head title="Home" />
+      <div className="col-span-12">
+        <div className="bg-white dark:bg-gray-900 rounded-xl shadow-sm p-8 text-center">
+          <h1 className="text-4xl font-bold mb-4" style={{ color: 'var(--color-text)' }}>
+            Welkom bij {hotelName}
+          </h1>
+          <p className="text-lg" style={{ color: 'var(--color-text-muted)' }}>
+            Dit is een Inertia.js pagina — zelfde layout, zelfde Tailwind, zelfde stijlen.
+          </p>
+          <div className="mt-8 flex justify-center gap-4">
+            <a
+              href="/"
+              className="px-6 py-3 rounded-xl font-semibold transition-all duration-200 hover:scale-105"
+              style={{
+                backgroundColor: 'var(--color-primary)',
+                color: 'var(--button-text-color)',
+              }}
+            >
+              Naar huis
+            </a>
+          </div>
+        </div>
+      </div>
+    </>
+  )
+}

resources/js/pages/Home.tsx

@@ -1,43 +0,0 @@
-import { Head } from "@inertiajs/react";
-
-interface HomeProps {
-  auth: Record<string, unknown>;
-  hotelName: string;
-}
-
-export default function Home({ hotelName }: HomeProps) {
-  return (
-    <>
-      <Head title="Home" />
-      <div className="col-span-12">
-        <div className="rounded-xl bg-white p-8 text-center shadow-sm dark:bg-gray-900">
-          <h1
-            className="mb-4 text-4xl font-bold"
-            style={{ color: "var(--color-text)" }}
-          >
-            Welkom bij {hotelName}
-          </h1>
-          <p
-            className="text-lg"
-            style={{ color: "var(--color-text-muted)" }}
-          >
-            Dit is een Inertia.js pagina — zelfde layout, zelfde Tailwind,
-            zelfde stijlen.
-          </p>
-          <div className="mt-8 flex justify-center gap-4">
-            <a
-              href="/"
-              className="rounded-xl px-6 py-3 font-semibold transition-all duration-200 hover:scale-105"
-              style={{
-                backgroundColor: "var(--color-primary)",
-                color: "var(--button-text-color)",
-              }}
-            >
-              Naar huis
-            </a>
-          </div>
-        </div>
-      </div>
-    </>
-  );
-}

resources/js/pages/Index.jsx

@@ -0,0 +1,119 @@
+import { Head, usePage } from '@inertiajs/react'
+
+export default function Index({ articles, photos }) {
+  const { avatarImager } = usePage().props
+
+  return (
+    <>
+      <Head title="Welkom" />
+
+      <div className="col-span-12 space-y-14">
+        <div className="col-span-12">
+          <div className="flex w-full flex-col gap-y-4 overflow-hidden rounded-lg p-3">
+            <div className="flex gap-x-2">
+              <div className="hotel-icon relative flex min-h-[50px] min-w-[50px] max-w-[50px] max-h-[50px] items-center justify-center rounded-full" />
+              <div className="flex flex-col">
+                <p className="font-semibold text-black dark:text-gray-200">Laatste nieuws</p>
+                <p className="dark:text-gray-500">Blijf op de hoogte van het laatste hotel nieuws.</p>
+              </div>
+            </div>
+
+            <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
+              {articles.length > 0 ? articles.map(article => (
+                <a key={article.id} href={`/community/article/${article.slug}`}
+                   className="group relative block h-[210px] w-full overflow-hidden rounded shadow-sm transition-all duration-200 ease-in-out hover:scale-[101%]"
+                   style={{ backgroundColor: 'var(--color-surface)' }}
+                   onMouseEnter={e => {
+                     const el = e.currentTarget.querySelector('.article-img-inner')
+                     if (el) el.classList.add('article-image-slide')
+                   }}
+                   onMouseLeave={e => {
+                     const el = e.currentTarget.querySelector('.article-img-inner')
+                     if (el) el.classList.remove('article-image-slide')
+                   }}>
+                  <div className="article-img-inner h-[100px] w-full bg-cover bg-center transition-[background-position] duration-300"
+                       style={{ backgroundImage: `url('/storage/${article.image}')`, backgroundPosition: '300px 220px' }}>
+                  </div>
+                  <div className="px-3 md:px-4">
+                    <p className="truncate text-base font-semibold md:text-lg dark:text-gray-200">{article.title}</p>
+                    <div className="flex items-center gap-x-2">
+                      {article.user && (
+                        <>
+                          <div className="mt-2 flex h-8 w-8 items-center justify-center overflow-hidden rounded-full md:mt-3 md:h-10 md:w-10"
+                               style={{ backgroundColor: 'var(--color-background)' }}>
+                            <img src={`${avatarImager}${article.user.look}&headonly=1`}
+                                 alt="" className="h-full w-full object-cover" />
+                          </div>
+                          <p className="mt-2 text-sm font-semibold md:mt-4 md:text-base"
+                             style={{ color: 'var(--color-text-muted)' }}>{article.user.username}</p>
+                        </>
+                      )}
+                    </div>
+                  </div>
+                </a>
+              )) : (
+                <>
+                  {[1, 2, 3, 4].map(i => (
+                    <div key={i}
+                         className="h-[210px] w-full overflow-hidden rounded bg-white shadow-sm dark:bg-gray-900">
+                      <div className="article-image"
+                           style={{ background: "url('https://i.imgur.com/uGLDOUu.png')" }} />
+                      <div className="mt-4 px-4">
+                        <p className="truncate text-lg font-semibold dark:text-gray-200">Geen artikelen</p>
+                        <div className="flex items-center gap-x-2">
+                          <div className="mt-3 flex h-10 w-10 items-center justify-center overflow-hidden rounded-full bg-gray-100 dark:bg-gray-800">
+                            <img src={`${avatarImager}&headonly=1`} alt="" />
+                          </div>
+                          <p className="mt-4 font-semibold dark:text-gray-400">Epicnabbo</p>
+                        </div>
+                      </div>
+                    </div>
+                  ))}
+                </>
+              )}
+            </div>
+          </div>
+        </div>
+
+        {photos.length > 0 && (
+          <div className="col-span-12">
+            <div className="flex w-full flex-col gap-y-4 overflow-hidden rounded-lg p-3">
+              <div className="flex gap-x-2">
+                <div className="camera-icon relative flex min-h-[50px] min-w-[50px] max-w-[50px] max-h-[50px] items-center justify-center rounded-full" />
+                <div className="flex flex-col">
+                  <p className="font-semibold text-black dark:text-gray-200">Laatste foto's</p>
+                  <p className="dark:text-gray-500">Bekijk de mooiste momenten vastgelegd door gebruikers.</p>
+                </div>
+              </div>
+
+              <div className="grid grid-cols-2 gap-3 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-5">
+                {photos.map(photo => (
+                  <a key={photo.id} href={photo.url} data-fancybox="gallery" className="group block cursor-pointer">
+                    <div className="relative overflow-hidden rounded-lg border border-gray-600 shadow-md transition-all duration-300 hover:border-[#eeb425]">
+                      <div className="relative aspect-[4/3] overflow-hidden">
+                        <img src={photo.url} alt={`Photo by ${photo.user?.username || 'Unknown'}`}
+                             className="h-full w-full object-cover object-center transition-transform duration-300 group-hover:scale-110" />
+                        <div className="absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent opacity-0 transition-opacity duration-300 group-hover:opacity-100" />
+                      </div>
+                      <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/90 to-transparent p-2">
+                        <div className="flex items-center gap-2">
+                          <div className="flex h-7 w-7 items-center justify-center overflow-hidden rounded-full border border-gray-500 bg-gray-700">
+                            <img src={`${avatarImager}${photo.user?.look || ''}&direction=2&headonly=1&head_direction=2&gesture=sml`}
+                                 alt={photo.user?.username || 'Unknown'} className="h-full w-full object-cover" />
+                          </div>
+                          <div className="min-w-0 flex-1">
+                            <p className="truncate text-sm font-semibold text-white">{photo.user?.username || 'Unknown'}</p>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </a>
+                ))}
+              </div>
+            </div>
+          </div>
+        )}
+      </div>
+    </>
+  )
+}

resources/js/pages/Index.tsx

@@ -1,206 +0,0 @@
-import { Head, usePage } from "@inertiajs/react";
-
-interface User {
-  look: string;
-  username: string;
-}
-
-interface Article {
-  id: number;
-  slug: string;
-  title: string;
-  image: string;
-  user?: User;
-}
-
-interface Photo {
-  id: number;
-  url: string;
-  user?: User;
-}
-
-interface IndexProps {
-  articles: Article[];
-  photos: Photo[];
-}
-
-interface SharedProps extends Record<string, unknown> {
-  avatarImager: string;
-}
-
-export default function Index({ articles, photos }: IndexProps) {
-  const { avatarImager } = usePage<SharedProps>().props;
-
-  return (
-    <>
-      <Head title="Welkom" />
-
-      <div className="col-span-12 space-y-14">
-        <div className="col-span-12">
-          <div className="flex w-full flex-col gap-y-4 overflow-hidden rounded-lg p-3">
-            <div className="flex gap-x-2">
-              <div className="hotel-icon relative flex min-h-[50px] min-w-[50px] max-w-[50px] items-center justify-center rounded-full" />
-              <div className="flex flex-col">
-                <p className="font-semibold text-black dark:text-gray-200">
-                  Laatste nieuws
-                </p>
-                <p className="dark:text-gray-500">
-                  Blijf op de hoogte van het laatste hotel nieuws.
-                </p>
-              </div>
-            </div>
-
-            <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
-              {articles.length > 0
-                ? articles.map((article) => (
-                    <a
-                      key={article.id}
-                      href={`/community/article/${article.slug}`}
-                      className="group relative block h-[210px] w-full overflow-hidden rounded shadow-sm transition-all duration-200 ease-in-out hover:scale-[101%]"
-                      style={{ backgroundColor: "var(--color-surface)" }}
-                      onMouseEnter={(e) => {
-                        const el = e.currentTarget.querySelector(
-                          ".article-img-inner",
-                        );
-                        if (el) el.classList.add("article-image-slide");
-                      }}
-                      onMouseLeave={(e) => {
-                        const el = e.currentTarget.querySelector(
-                          ".article-img-inner",
-                        );
-                        if (el) el.classList.remove("article-image-slide");
-                      }}
-                    >
-                      <div
-                        className="article-img-inner h-[100px] w-full bg-cover bg-center transition-[background-position] duration-300"
-                        style={{
-                          backgroundImage: `url('/storage/${article.image}')`,
-                          backgroundPosition: "300px 220px",
-                        }}
-                      />
-                      <div className="px-3 md:px-4">
-                        <p className="truncate text-base font-semibold md:text-lg dark:text-gray-200">
-                          {article.title}
-                        </p>
-                        <div className="flex items-center gap-x-2">
-                          {article.user && (
-                            <>
-                              <div
-                                className="mt-2 flex h-8 w-8 items-center justify-center overflow-hidden rounded-full md:mt-3 md:h-10 md:w-10"
-                                style={{
-                                  backgroundColor: "var(--color-background)",
-                                }}
-                              >
-                                <img
-                                  src={`${avatarImager}${article.user.look}&headonly=1`}
-                                  alt=""
-                                  className="h-full w-full object-cover"
-                                />
-                              </div>
-                              <p
-                                className="mt-2 text-sm font-semibold md:mt-4 md:text-base"
-                                style={{
-                                  color: "var(--color-text-muted)",
-                                }}
-                              >
-                                {article.user.username}
-                              </p>
-                            </>
-                          )}
-                        </div>
-                      </div>
-                    </a>
-                  ))
-                : [1, 2, 3, 4].map((i) => (
-                    <div
-                      key={i}
-                      className="h-[210px] w-full overflow-hidden rounded bg-white shadow-sm dark:bg-gray-900"
-                    >
-                      <div
-                        className="article-image"
-                        style={{
-                          background:
-                            "url('https://i.imgur.com/uGLDOUu.png')",
-                        }}
-                      />
-                      <div className="mt-4 px-4">
-                        <p className="truncate text-lg font-semibold dark:text-gray-200">
-                          Geen artikelen
-                        </p>
-                        <div className="flex items-center gap-x-2">
-                          <div className="mt-3 flex h-10 w-10 items-center justify-center overflow-hidden rounded-full bg-gray-100 dark:bg-gray-800">
-                            <img
-                              src={`${avatarImager}&headonly=1`}
-                              alt=""
-                            />
-                          </div>
-                          <p className="mt-4 font-semibold dark:text-gray-400">
-                            Epicnabbo
-                          </p>
-                        </div>
-                      </div>
-                    </div>
-                  ))}
-            </div>
-          </div>
-        </div>
-
-        {photos.length > 0 && (
-          <div className="col-span-12">
-            <div className="flex w-full flex-col gap-y-4 overflow-hidden rounded-lg p-3">
-              <div className="flex gap-x-2">
-                <div className="camera-icon relative flex min-h-[50px] min-w-[50px] max-w-[50px] items-center justify-center rounded-full" />
-                <div className="flex flex-col">
-                  <p className="font-semibold text-black dark:text-gray-200">
-                    Laatste foto's
-                  </p>
-                  <p className="dark:text-gray-500">
-                    Bekijk de mooiste momenten vastgelegd door gebruikers.
-                  </p>
-                </div>
-              </div>
-
-              <div className="grid grid-cols-2 gap-3 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-5">
-                {photos.map((photo) => (
-                  <a
-                    key={photo.id}
-                    href={photo.url}
-                    data-fancybox="gallery"
-                    className="group block cursor-pointer"
-                  >
-                    <div className="relative overflow-hidden rounded-lg border border-gray-600 shadow-md transition-all duration-300 hover:border-[#eeb425]">
-                      <div className="relative aspect-[4/3] overflow-hidden">
-                        <img
-                          src={photo.url}
-                          alt={`Photo by ${photo.user?.username || "Unknown"}`}
-                          className="h-full w-full object-cover object-center transition-transform duration-300 group-hover:scale-110"
-                        />
-                        <div className="absolute inset-0 bg-gradient-to-t from-black/70 via-transparent to-transparent opacity-0 transition-opacity duration-300 group-hover:opacity-100" />
-                      </div>
-                      <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/90 to-transparent p-2">
-                        <div className="flex items-center gap-2">
-                          <div className="flex h-7 w-7 items-center justify-center overflow-hidden rounded-full border border-gray-500 bg-gray-700">
-                            <img
-                              src={`${avatarImager}${photo.user?.look || ""}&direction=2&headonly=1&head_direction=2&gesture=sml`}
-                              alt={photo.user?.username || "Unknown"}
-                              className="h-full w-full object-cover"
-                            />
-                          </div>
-                          <div className="min-w-0 flex-1">
-                            <p className="truncate text-sm font-semibold text-white">
-                              {photo.user?.username || "Unknown"}
-                            </p>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </a>
-                ))}
-              </div>
-            </div>
-          </div>
-        )}
-      </div>
-    </>
-  );
-}

resources/js/ssr.jsx

@@ -0,0 +1,12 @@
+import { createInertiaApp } from '@inertiajs/react'
+import { createRoot } from 'react-dom/client'
+
+createInertiaApp({
+  resolve: name => {
+    const pages = import.meta.glob('./pages/**/*.jsx', { eager: true })
+    return pages[`./pages/${name}.jsx`]
+  },
+  setup({ el, App, props }) {
+    createRoot(el).render(<App {...props} />)
+  },
+})

resources/js/ssr.tsx

@@ -1,16 +0,0 @@
-import { createInertiaApp } from "@inertiajs/react";
-import { createRoot } from "react-dom/client";
-import type { ComponentType } from "react";
-
-createInertiaApp({
-  resolve: (name: string) => {
-    const pages = import.meta.glob<{ default: ComponentType<unknown> }>(
-      "./pages/**/*.tsx",
-      { eager: true },
-    );
-    return pages[`./pages/${name}.tsx`];
-  },
-  setup({ el, App, props }) {
-    createRoot(el).render(<App {...props} />);
-  },
-});

resources/js/types.d.ts

@@ -1,31 +0,0 @@
-declare module "alpinejs" {
-  interface Alpine {
-    data(name: string, callback: (...args: unknown[]) => Record<string, unknown>): void;
-    plugin(plugin: unknown): void;
-    start(): void;
-  }
-  const Alpine: Alpine;
-  export default Alpine;
-}
-
-declare module "@alpinejs/focus" {
-  const focus: unknown;
-  export default focus;
-}
-
-declare module "turbolinks" {
-  interface TurbolinksStatic {
-    start(): void;
-  }
-  const Turbolinks: TurbolinksStatic;
-  export default Turbolinks;
-}
-
-interface Window {
-  _: import("lodash").default;
-  axios: import("axios").AxiosStatic;
-  App: {
-    defaultReactions: string[];
-    isAuthenticated: boolean;
-  };
-}

resources/themes/atom/js/app.js

@@ -0,0 +1,25 @@
+import "./bootstrap";
+import "./external/flowbite";
+
+import "swiper/css";
+import "swiper/css/pagination";
+
+import Alpine from "alpinejs";
+import Focus from "@alpinejs/focus";
+
+import ArticleReactions from "./components/ArticleReactions.js";
+
+import ThemeSwitcher from "./components/ThemeSwitcher.js";
+import AtomSliders from "./components/AtomSliders.js";
+
+ThemeSwitcher.init();
+ArticleReactions.init();
+AtomSliders.init();
+Alpine.plugin(Focus);
+Alpine.start();
+
+console.log(
+  "%cAtom CMS%c\n\nAtom CMS is a CMS for made for the community to enjoy. You can join our wonderful community at https://discord.gg/rX3aShUHdg\n\n",
+  "color: #14619c; -webkit-text-stroke: 2px black; font-size: 32px; font-weight: bold;",
+  "",
+);

resources/themes/atom/js/app.ts

@@ -1,18 +0,0 @@
-import "./bootstrap";
-import "./external/flowbite";
-
-import "swiper/css";
-import "swiper/css/pagination";
-
-import Alpine from "alpinejs";
-import Focus from "@alpinejs/focus";
-
-import ArticleReactions from "./components/ArticleReactions";
-import ThemeSwitcher from "./components/ThemeSwitcher";
-import AtomSliders from "./components/AtomSliders";
-
-ThemeSwitcher.init();
-ArticleReactions.init();
-AtomSliders.init();
-Alpine.plugin(Focus);
-Alpine.start();

resources/themes/atom/js/bootstrap.js

@@ -0,0 +1,34 @@
+/**
+ * We'll load the axios HTTP library which allows us to easily issue requests
+ * to our Laravel back-end. This library automatically handles sending the
+ * CSRF token as a header based on the value of the "XSRF" token cookie.
+ */
+
+import axios from "axios";
+import Turbolinks from "turbolinks";
+
+window.axios = axios;
+window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
+
+Turbolinks.start();
+
+/**
+ * Echo exposes an expressive API for subscribing to channels and listening
+ * for events that are broadcast by Laravel. Echo and event broadcasting
+ * allows your team to easily build robust real-time web applications.
+ */
+
+// import Echo from 'laravel-echo';
+
+// import Pusher from 'pusher-js';
+// window.Pusher = Pusher;
+
+// window.Echo = new Echo({
+//     broadcaster: 'pusher',
+//     key: import.meta.env.VITE_PUSHER_APP_KEY,
+//     wsHost: import.meta.env.VITE_PUSHER_HOST ?? `ws-${import.meta.env.VITE_PUSHER_CLUSTER}.pusher.com`,
+//     wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
+//     wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
+//     forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
+//     enabledTransports: ['ws', 'wss'],
+// });

resources/themes/atom/js/bootstrap.ts

@@ -1,7 +0,0 @@
-import axios from "axios";
-import Turbolinks from "turbolinks";
-
-window.axios = axios;
-window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
-
-Turbolinks.start();

resources/themes/atom/js/components/ArticleReactions.js

@@ -0,0 +1,131 @@
+import Alpine from "alpinejs";
+
+const ArticleReactions = {
+  init() {
+    document.addEventListener("alpine:init", () => this.startComponent());
+  },
+
+  startComponent() {
+    Alpine.data(
+      "reactions",
+      (myReactions = [], articleReactions = [], url = "") => ({
+        url,
+        myReactions,
+        articleReactions,
+        allReactions: [],
+        isAuthenticated: false,
+
+        init() {
+          this.treatArticleReactions();
+          this.allReactions = window.App.defaultReactions;
+          this.isAuthenticated = window.App.isAuthenticated;
+
+          this.dispatchFlowbiteEvent();
+        },
+
+        treatArticleReactions() {
+          let articleReactions = this.articleReactions;
+
+          this.articleReactions = [];
+
+          Object.entries(articleReactions).forEach((reactionData) => {
+            let reactionName = reactionData[0],
+              reactions = Object.values(reactionData[1]);
+
+            this.articleReactions.push({
+              id: this.generateVirtualReactionId(reactionName),
+              name: reactionName,
+              count: reactions.length,
+              users: reactions.map((reaction) => reaction.user?.username ?? ""),
+            });
+          });
+        },
+
+        toggleReaction(reaction) {
+          if (!this.url.length || !this.isAuthenticated) return;
+
+          axios.post(this.url, { reaction }).then((response) => {
+            if (!response.data.success) return;
+
+            if (!response.data.added) {
+              this.removeReaction(reaction, response.data.username);
+              return;
+            }
+
+            this.addReaction(reaction, response.data.username);
+          });
+        },
+
+        addReaction(name, username) {
+          this.myReactions.push(name);
+
+          let existingReaction = this.getReactionDataFromName(name);
+
+          if (existingReaction) {
+            existingReaction.count++;
+            existingReaction.users.push(username);
+            return;
+          }
+
+          this.articleReactions.push({
+            id: this.generateVirtualReactionId(name),
+            name,
+            count: 1,
+            users: [username],
+          });
+
+          this.dispatchFlowbiteEvent();
+        },
+
+        removeReaction(name, username) {
+          this.myReactions.splice(this.myReactions.indexOf(name), 1);
+
+          let reactionData = this.getReactionDataFromName(name);
+
+          if (reactionData.count > 1) {
+            reactionData.count--;
+            reactionData.users.splice(reactionData.users.indexOf(username), 1);
+            return;
+          }
+
+          this.$nextTick(() => {
+            this.articleReactions.splice(
+              this.articleReactions.indexOf(reactionData),
+              1,
+            );
+          });
+        },
+
+        generateVirtualReactionId(name) {
+          return name + Math.floor(Math.random() * 1000);
+        },
+
+        canAddReactionFromModal(name) {
+          return !this.userHasReaction(name) && !this.articleHasReaction(name);
+        },
+
+        userHasReaction(reaction) {
+          return this.myReactions.includes(reaction.name);
+        },
+
+        articleHasReaction(name) {
+          return typeof this.getReactionDataFromName(name) !== "undefined";
+        },
+
+        getReactionDataFromName(name) {
+          return this.articleReactions.find(
+            (reaction) => reaction.name === name,
+          );
+        },
+
+        dispatchFlowbiteEvent() {
+          this.$nextTick(() =>
+            document.dispatchEvent(new CustomEvent("reactions:loaded")),
+          );
+        },
+      }),
+    );
+  },
+};
+
+export { ArticleReactions as default };

resources/themes/atom/js/components/ArticleReactions.ts

@@ -1,147 +0,0 @@
-import Alpine from "alpinejs";
-
-interface ReactionData {
-  id: string;
-  name: string;
-  count: number;
-  users: string[];
-}
-
-interface ReactionComponent extends Record<string, unknown> {
-  url: string;
-  myReactions: string[];
-  articleReactions: ReactionData[];
-  allReactions: string[];
-  isAuthenticated: boolean;
-  init(): void;
-  treatArticleReactions(rawReactions: Record<string, { user?: { username: string } }[]>): void;
-  toggleReaction(reaction: string): void;
-  addReaction(name: string, username: string): void;
-  removeReaction(name: string, username: string): void;
-  generateVirtualReactionId(name: string): string;
-  canAddReactionFromModal(name: string): boolean;
-  userHasReaction(reaction: ReactionData | string): boolean;
-  articleHasReaction(name: string): boolean;
-  getReactionDataFromName(name: string): ReactionData | undefined;
-  dispatchFlowbiteEvent(): void;
-  $nextTick: (callback: () => void) => void;
-}
-
-const ArticleReactions = {
-  init() {
-    document.addEventListener("alpine:init", () => this.startComponent());
-  },
-
-  startComponent() {
-    Alpine.data("reactions", (...args: unknown[]) => {
-      const [myReactions = [], , url = ""] = args as [string[], Record<string, { user?: { username: string } }[]>, string];
-      const rawArticleReactions = args[1] as Record<string, { user?: { username: string } }[]> | undefined;
-
-      return {
-        url,
-        myReactions: myReactions as string[],
-        articleReactions: [] as ReactionData[],
-        allReactions: [] as string[],
-        isAuthenticated: false,
-
-        init(this: ReactionComponent) {
-          if (rawArticleReactions) {
-            this.treatArticleReactions(rawArticleReactions);
-          }
-          this.allReactions = window.App.defaultReactions;
-          this.isAuthenticated = window.App.isAuthenticated;
-          this.dispatchFlowbiteEvent();
-        },
-
-        treatArticleReactions(this: ReactionComponent, raw: Record<string, { user?: { username: string } }[]>) {
-          const transformed: ReactionData[] = [];
-
-          Object.entries(raw).forEach(([name, reactions]) => {
-            const values = Object.values(reactions);
-            transformed.push({
-              id: this.generateVirtualReactionId(name),
-              name,
-              count: values.length,
-              users: values.map((r) => r.user?.username ?? ""),
-            });
-          });
-
-          this.articleReactions = transformed;
-        },
-
-        toggleReaction(this: ReactionComponent, reaction: string) {
-          if (!this.url.length || !this.isAuthenticated) return;
-
-          window.axios
-            .post(this.url, { reaction })
-            .then((response: { data: { success: boolean; added: boolean; username: string } }) => {
-              if (!response.data.success) return;
-              if (!response.data.added) {
-                this.removeReaction(reaction, response.data.username);
-                return;
-              }
-              this.addReaction(reaction, response.data.username);
-            });
-        },
-
-        addReaction(this: ReactionComponent, name: string, username: string) {
-          this.myReactions.push(name);
-          const existing = this.getReactionDataFromName(name);
-          if (existing) {
-            existing.count++;
-            existing.users.push(username);
-            return;
-          }
-          this.articleReactions.push({
-            id: this.generateVirtualReactionId(name),
-            name,
-            count: 1,
-            users: [username],
-          });
-          this.dispatchFlowbiteEvent();
-        },
-
-        removeReaction(this: ReactionComponent, name: string, username: string) {
-          this.myReactions.splice(this.myReactions.indexOf(name), 1);
-          const data = this.getReactionDataFromName(name);
-          if (!data) return;
-          if (data.count > 1) {
-            data.count--;
-            data.users.splice(data.users.indexOf(username), 1);
-            return;
-          }
-          this.$nextTick(() => {
-            this.articleReactions.splice(this.articleReactions.indexOf(data), 1);
-          });
-        },
-
-        generateVirtualReactionId(this: ReactionComponent, name: string): string {
-          return name + Math.floor(Math.random() * 1000);
-        },
-
-        canAddReactionFromModal(this: ReactionComponent, name: string): boolean {
-          return !this.userHasReaction(name) && !this.articleHasReaction(name);
-        },
-
-        userHasReaction(this: ReactionComponent, reaction: ReactionData | string): boolean {
-          const name = typeof reaction === "string" ? reaction : reaction.name;
-          return this.myReactions.includes(name);
-        },
-
-        articleHasReaction(this: ReactionComponent, name: string): boolean {
-          return typeof this.getReactionDataFromName(name) !== "undefined";
-        },
-
-        getReactionDataFromName(this: ReactionComponent, name: string): ReactionData | undefined {
-          return this.articleReactions.find((r) => r.name === name);
-        },
-
-        dispatchFlowbiteEvent(this: ReactionComponent) {
-          this.$nextTick(() => document.dispatchEvent(new CustomEvent("reactions:loaded")));
-        },
-      } as ReactionComponent;
-    });
-  },
-};
-
-export { ArticleReactions as default };

resources/themes/atom/js/components/AtomSliders.js

@@ -1,11 +1,6 @@
 import Swiper from "swiper";
 
-interface AtomSlidersStore {
-  init(): void;
-  initArticleSlider(): void;
-}
-
-const AtomSliders: AtomSlidersStore = {
+const AtomSliders = {
   init() {
     document.addEventListener("turbolinks:load", () => {
       this.initArticleSlider();

resources/themes/atom/js/components/ThemeSwitcher.js

@@ -1,19 +1,10 @@
-type Theme = "light" | "dark";
-
-interface ThemeSwitcherStore {
-  currentTheme: Theme;
-  init(): void;
-  initButton(): void;
-  toggleTheme(): void;
-}
-
-const ThemeSwitcher: ThemeSwitcherStore = {
+const ThemeSwitcher = {
   currentTheme: "light",
 
   init() {
     if (
       localStorage.theme === "dark" ||
-      (typeof window.matchMedia !== "undefined" &&
+      (typeof window.matchMedia != "undefined" &&
         window.matchMedia("(prefers-color-scheme: dark)").matches &&
         localStorage.theme !== "light")
     ) {
@@ -24,7 +15,7 @@ const ThemeSwitcher: ThemeSwitcherStore = {
   },
 
   initButton() {
-    const themeSwitcher = document.getElementById("theme-switcher");
+    let themeSwitcher = document.getElementById("theme-switcher");
 
     themeSwitcher?.addEventListener("click", () => this.toggleTheme());
   },

resources/themes/atom/views/client/nitro.blade.php

@@ -9,7 +9,7 @@
 
  <link href="https://fonts.googleapis.com/css2?family=Ubuntu+Condensed&display=swap" rel="stylesheet">
 
- @vite(['resources/themes/' . setting('theme') . '/css/app.css', 'resources/themes/' . setting('theme') . '/js/app.ts'], 'build')
+ @vite(['resources/themes/' . setting('theme') . '/css/app.css', 'resources/themes/' . setting('theme') . '/js/app.js'], 'build')
 
  <style>
  :root {

resources/themes/atom/views/layouts/app.blade.php

@@ -27,7 +27,7 @@
  <script src="{{ asset('assets/js/tippy-bundle.umd.min.js') }}"></script>
  <link rel="stylesheet" href="{{ asset('assets/css/scale.min.css') }}"/>
 
- @vite(['resources/themes/' . setting('theme', 'atom') . '/css/app.css', 'resources/themes/' . setting('theme', 'atom') . '/js/app.ts'], 'build')
+ @vite(['resources/themes/' . setting('theme', 'atom') . '/css/app.css', 'resources/themes/' . setting('theme', 'atom') . '/js/app.js'], 'build')
 
  <style>
  :root {

resources/themes/atom/views/layouts/guest.blade.php

@@ -11,7 +11,7 @@
  <!-- Fonts -->
  <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap">
 
- @vite(['resources/themes/' . setting('theme') . '/css/app.css', 'resources/themes/' . setting('theme') . '/js/app.ts'], 'build')
+ @vite(['resources/themes/' . setting('theme') . '/css/app.css', 'resources/themes/' . setting('theme') . '/js/app.js'], 'build')
 
  <style>
  :root {

resources/themes/atom/views/maintenance.blade.php

@@ -10,7 +10,7 @@
  <link rel="stylesheet" href="https://unpkg.com/flowbite@1.5.1/dist/flowbite.min.css"/>
  <script src="https://unpkg.com/flowbite@1.5.1/dist/flowbite.js"></script>
 
- @vite(['resources/themes/' . setting('theme') . '/css/app.css', 'resources/themes/' . setting('theme') . '/js/app.ts'], 'build')
+ @vite(['resources/themes/' . setting('theme') . '/css/app.css', 'resources/themes/' . setting('theme') . '/js/app.js'], 'build')
 
  <style>
  .gradient-bg {

resources/themes/atom/vite.config.js

@@ -12,10 +12,10 @@ export default defineConfig({
     laravel({
       input: [
         path.resolve(__dirname, "css/app.css"),
-        path.resolve(__dirname, "js/app.ts"),
-        "resources/js/global.ts",
+        path.resolve(__dirname, "js/app.js"),
+        "resources/js/global.js",
         "resources/css/global.css",
-        "resources/js/ssr.tsx",
+        "resources/js/ssr.jsx",
       ],
     }),
 
@@ -33,7 +33,7 @@ export default defineConfig({
   ],
   resolve: {
     alias: {
-      "@": path.resolve(__dirname, "js/app.ts"),
+      "@": path.resolve(__dirname, "js/app.js"),
     },
   },
   css: {

resources/themes/dusk/js/app.js

@@ -0,0 +1,40 @@
+import "./bootstrap";
+import "./external/flowbite";
+
+import "swiper/css";
+import "swiper/css/navigation";
+import "swiper/css/pagination";
+
+import Alpine from "alpinejs";
+import Focus from "@alpinejs/focus";
+
+import ArticleReactions from "./components/ArticleReactions.js";
+
+import Swiper from "swiper";
+import { Navigation, Pagination } from "swiper/modules";
+
+ArticleReactions.init();
+Alpine.plugin(Focus);
+Alpine.start();
+
+Swiper.use([Navigation, Pagination]);
+
+// Swiper Initialization
+document.addEventListener("DOMContentLoaded", function () {
+  const swiper = new Swiper(".swiper", {
+    // Your Swiper options here
+    navigation: {
+      nextEl: ".swiper-button-next",
+      prevEl: ".swiper-button-prev",
+    },
+    pagination: {
+      el: ".swiper-pagination",
+    },
+  });
+});
+
+console.log(
+  "%cAtom CMS%c\n\nAtom CMS is a CMS for made for the community to enjoy. You can join our wonderful community at https://discord.gg/rX3aShUHdg\n\n",
+  "color: #14619c; -webkit-text-stroke: 2px black; font-size: 32px; font-weight: bold;",
+  "",
+);

resources/themes/dusk/js/app.ts

@@ -1,36 +0,0 @@
-import "./bootstrap";
-import "./external/flowbite";
-
-import "swiper/css";
-import "swiper/css/navigation";
-import "swiper/css/pagination";
-
-import Alpine from "alpinejs";
-import Focus from "@alpinejs/focus";
-
-import ArticleReactions from "./components/ArticleReactions";
-
-import Swiper from "swiper";
-import { Navigation, Pagination } from "swiper/modules";
-
-ArticleReactions.init();
-Alpine.plugin(Focus);
-Alpine.start();
-
-Swiper.use([Navigation, Pagination]);
-
-document.addEventListener("DOMContentLoaded", function () {
-  const swiperEl = document.querySelector(".swiper");
-
-  if (swiperEl) {
-    new Swiper(swiperEl as HTMLElement, {
-      navigation: {
-        nextEl: ".swiper-button-next",
-        prevEl: ".swiper-button-prev",
-      },
-      pagination: {
-        el: ".swiper-pagination",
-      },
-    });
-  }
-});

resources/themes/dusk/js/bootstrap.js

@@ -0,0 +1,31 @@
+/**
+ * We'll load the axios HTTP library which allows us to easily issue requests
+ * to our Laravel back-end. This library automatically handles sending the
+ * CSRF token as a header based on the value of the "XSRF" token cookie.
+ */
+
+import axios from "axios";
+window.axios = axios;
+
+window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";
+
+/**
+ * Echo exposes an expressive API for subscribing to channels and listening
+ * for events that are broadcast by Laravel. Echo and event broadcasting
+ * allows your team to easily build robust real-time web applications.
+ */
+
+// import Echo from 'laravel-echo';
+
+// import Pusher from 'pusher-js';
+// window.Pusher = Pusher;
+
+// window.Echo = new Echo({
+//     broadcaster: 'pusher',
+//     key: import.meta.env.VITE_PUSHER_APP_KEY,
+//     wsHost: import.meta.env.VITE_PUSHER_HOST ?? `ws-${import.meta.env.VITE_PUSHER_CLUSTER}.pusher.com`,
+//     wsPort: import.meta.env.VITE_PUSHER_PORT ?? 80,
+//     wssPort: import.meta.env.VITE_PUSHER_PORT ?? 443,
+//     forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
+//     enabledTransports: ['ws', 'wss'],
+// });

resources/themes/dusk/js/bootstrap.ts

@@ -1,4 +0,0 @@
-import axios from "axios";
-
-window.axios = axios;
-window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";

resources/themes/dusk/js/components/ArticleReactions.js

@@ -0,0 +1,131 @@
+import Alpine from "alpinejs";
+
+const ArticleReactions = {
+  init() {
+    document.addEventListener("alpine:init", () => this.startComponent());
+  },
+
+  startComponent() {
+    Alpine.data(
+      "reactions",
+      (myReactions = [], articleReactions = [], url = "") => ({
+        url,
+        myReactions,
+        articleReactions,
+        allReactions: [],
+        isAuthenticated: false,
+
+        init() {
+          this.treatArticleReactions();
+          this.allReactions = window.App.defaultReactions;
+          this.isAuthenticated = window.App.isAuthenticated;
+
+          this.dispatchFlowbiteEvent();
+        },
+
+        treatArticleReactions() {
+          let articleReactions = this.articleReactions;
+
+          this.articleReactions = [];
+
+          Object.entries(articleReactions).forEach((reactionData) => {
+            let reactionName = reactionData[0],
+              reactions = Object.values(reactionData[1]);
+
+            this.articleReactions.push({
+              id: this.generateVirtualReactionId(reactionName),
+              name: reactionName,
+              count: reactions.length,
+              users: reactions.map((reaction) => reaction.user?.username ?? ""),
+            });
+          });
+        },
+
+        toggleReaction(reaction) {
+          if (!this.url.length || !this.isAuthenticated) return;
+
+          axios.post(this.url, { reaction }).then((response) => {
+            if (!response.data.success) return;
+
+            if (!response.data.added) {
+              this.removeReaction(reaction, response.data.username);
+              return;
+            }
+
+            this.addReaction(reaction, response.data.username);
+          });
+        },
+
+        addReaction(name, username) {
+          this.myReactions.push(name);
+
+          let existingReaction = this.getReactionDataFromName(name);
+
+          if (existingReaction) {
+            existingReaction.count++;
+            existingReaction.users.push(username);
+            return;
+          }
+
+          this.articleReactions.push({
+            id: this.generateVirtualReactionId(name),
+            name,
+            count: 1,
+            users: [username],
+          });
+
+          this.dispatchFlowbiteEvent();
+        },
+
+        removeReaction(name, username) {
+          this.myReactions.splice(this.myReactions.indexOf(name), 1);
+
+          let reactionData = this.getReactionDataFromName(name);
+
+          if (reactionData.count > 1) {
+            reactionData.count--;
+            reactionData.users.splice(reactionData.users.indexOf(username), 1);
+            return;
+          }
+
+          this.$nextTick(() => {
+            this.articleReactions.splice(
+              this.articleReactions.indexOf(reactionData),
+              1,
+            );
+          });
+        },
+
+        generateVirtualReactionId(name) {
+          return name + Math.floor(Math.random() * 1000);
+        },
+
+        canAddReactionFromModal(name) {
+          return !this.userHasReaction(name) && !this.articleHasReaction(name);
+        },
+
+        userHasReaction(reaction) {
+          return this.myReactions.includes(reaction.name);
+        },
+
+        articleHasReaction(name) {
+          return typeof this.getReactionDataFromName(name) !== "undefined";
+        },
+
+        getReactionDataFromName(name) {
+          return this.articleReactions.find(
+            (reaction) => reaction.name === name,
+          );
+        },
+
+        dispatchFlowbiteEvent() {
+          this.$nextTick(() =>
+            document.dispatchEvent(new CustomEvent("reactions:loaded")),
+          );
+        },
+      }),
+    );
+  },
+};
+
+export { ArticleReactions as default };

resources/themes/dusk/js/components/ArticleReactions.ts

@@ -1,147 +0,0 @@
-import Alpine from "alpinejs";
-
-interface ReactionData {
-  id: string;
-  name: string;
-  count: number;
-  users: string[];
-}
-
-interface ReactionComponent extends Record<string, unknown> {
-  url: string;
-  myReactions: string[];
-  articleReactions: ReactionData[];
-  allReactions: string[];
-  isAuthenticated: boolean;
-  init(): void;
-  treatArticleReactions(rawReactions: Record<string, { user?: { username: string } }[]>): void;
-  toggleReaction(reaction: string): void;
-  addReaction(name: string, username: string): void;
-  removeReaction(name: string, username: string): void;
-  generateVirtualReactionId(name: string): string;
-  canAddReactionFromModal(name: string): boolean;
-  userHasReaction(reaction: ReactionData | string): boolean;
-  articleHasReaction(name: string): boolean;
-  getReactionDataFromName(name: string): ReactionData | undefined;
-  dispatchFlowbiteEvent(): void;
-  $nextTick: (callback: () => void) => void;
-}
-
-const ArticleReactions = {
-  init() {
-    document.addEventListener("alpine:init", () => this.startComponent());
-  },
-
-  startComponent() {
-    Alpine.data("reactions", (...args: unknown[]) => {
-      const [myReactions = [], , url = ""] = args as [string[], Record<string, { user?: { username: string } }[]>, string];
-      const rawArticleReactions = args[1] as Record<string, { user?: { username: string } }[]> | undefined;
-
-      return {
-        url,
-        myReactions: myReactions as string[],
-        articleReactions: [] as ReactionData[],
-        allReactions: [] as string[],
-        isAuthenticated: false,
-
-        init(this: ReactionComponent) {
-          if (rawArticleReactions) {
-            this.treatArticleReactions(rawArticleReactions);
-          }
-          this.allReactions = window.App.defaultReactions;
-          this.isAuthenticated = window.App.isAuthenticated;
-          this.dispatchFlowbiteEvent();
-        },
-
-        treatArticleReactions(this: ReactionComponent, raw: Record<string, { user?: { username: string } }[]>) {
-          const transformed: ReactionData[] = [];
-
-          Object.entries(raw).forEach(([name, reactions]) => {
-            const values = Object.values(reactions);
-            transformed.push({
-              id: this.generateVirtualReactionId(name),
-              name,
-              count: values.length,
-              users: values.map((r) => r.user?.username ?? ""),
-            });
-          });
-
-          this.articleReactions = transformed;
-        },
-
-        toggleReaction(this: ReactionComponent, reaction: string) {
-          if (!this.url.length || !this.isAuthenticated) return;
-
-          window.axios
-            .post(this.url, { reaction })
-            .then((response: { data: { success: boolean; added: boolean; username: string } }) => {
-              if (!response.data.success) return;
-              if (!response.data.added) {
-                this.removeReaction(reaction, response.data.username);
-                return;
-              }
-              this.addReaction(reaction, response.data.username);
-            });
-        },
-
-        addReaction(this: ReactionComponent, name: string, username: string) {
-          this.myReactions.push(name);
-          const existing = this.getReactionDataFromName(name);
-          if (existing) {
-            existing.count++;
-            existing.users.push(username);
-            return;
-          }
-          this.articleReactions.push({
-            id: this.generateVirtualReactionId(name),
-            name,
-            count: 1,
-            users: [username],
-          });
-          this.dispatchFlowbiteEvent();
-        },
-
-        removeReaction(this: ReactionComponent, name: string, username: string) {
-          this.myReactions.splice(this.myReactions.indexOf(name), 1);
-          const data = this.getReactionDataFromName(name);
-          if (!data) return;
-          if (data.count > 1) {
-            data.count--;
-            data.users.splice(data.users.indexOf(username), 1);
-            return;
-          }
-          this.$nextTick(() => {
-            this.articleReactions.splice(this.articleReactions.indexOf(data), 1);
-          });
-        },
-
-        generateVirtualReactionId(this: ReactionComponent, name: string): string {
-          return name + Math.floor(Math.random() * 1000);
-        },
-
-        canAddReactionFromModal(this: ReactionComponent, name: string): boolean {
-          return !this.userHasReaction(name) && !this.articleHasReaction(name);
-        },
-
-        userHasReaction(this: ReactionComponent, reaction: ReactionData | string): boolean {
-          const name = typeof reaction === "string" ? reaction : reaction.name;
-          return this.myReactions.includes(name);
-        },
-
-        articleHasReaction(this: ReactionComponent, name: string): boolean {
-          return typeof this.getReactionDataFromName(name) !== "undefined";
-        },
-
-        getReactionDataFromName(this: ReactionComponent, name: string): ReactionData | undefined {
-          return this.articleReactions.find((r) => r.name === name);
-        },
-
-        dispatchFlowbiteEvent(this: ReactionComponent) {
-          this.$nextTick(() => document.dispatchEvent(new CustomEvent("reactions:loaded")));
-        },
-      } as ReactionComponent;
-    });
-  },
-};
-
-export { ArticleReactions as default };

resources/themes/dusk/views/client/nitro.blade.php

@@ -9,7 +9,7 @@
 
     <link href="https://fonts.googleapis.com/css2?family=Ubuntu+Condensed&display=swap" rel="stylesheet">
 
-    @vite(['resources/themes/' .  setting('theme') . '/css/app.css', 'resources/themes/' .  setting('theme') . '/js/app.ts'], 'build')
+    @vite(['resources/themes/' .  setting('theme') . '/css/app.css', 'resources/themes/' .  setting('theme') . '/js/app.js'], 'build')
     
     @if(setting('button_enabled') == '1')
     <style>

resources/themes/dusk/views/layouts/app.blade.php

@@ -10,7 +10,7 @@
         <!-- Fonts -->
         <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap">
 
-        @vite(['resources/themes/' .  setting('theme', 'dusk') . '/css/app.css', 'resources/themes/' .  setting('theme') . '/js/app.ts'], 'build')
+        @vite(['resources/themes/' .  setting('theme', 'dusk') . '/css/app.css', 'resources/themes/' .  setting('theme') . '/js/app.js'], 'build')
 
         <style>
             :root {

resources/themes/dusk/views/maintenance.blade.php

@@ -11,7 +11,7 @@
     <link rel="stylesheet" href="https://unpkg.com/flowbite@1.5.1/dist/flowbite.min.css"/>
     <script src="https://unpkg.com/flowbite@1.5.1/dist/flowbite.js"></script>
 
-    @vite(['resources/themes/' .  setting('theme') . '/css/app.css', 'resources/themes/' .  setting('theme') . '/js/app.ts'], 'build')
+    @vite(['resources/themes/' .  setting('theme') . '/css/app.css', 'resources/themes/' .  setting('theme') . '/js/app.js'], 'build')
 </head>
 
 <body class="h-screen overflow-hidden relative bg-[#233143]">

resources/themes/dusk/vite.config.js

@@ -12,10 +12,10 @@ export default defineConfig({
     laravel({
       input: [
         path.resolve(__dirname, "css/app.css"),
-        path.resolve(__dirname, "js/app.ts"),
-        "resources/js/global.ts",
+        path.resolve(__dirname, "js/app.js"),
+        "resources/js/global.js",
         "resources/css/global.css",
-        "resources/js/ssr.tsx",
+        "resources/js/ssr.jsx",
       ],
     }),
 
@@ -33,7 +33,7 @@ export default defineConfig({
   ],
   resolve: {
     alias: {
-      "@": path.resolve(__dirname, "js/app.ts"),
+      "@": path.resolve(__dirname, "js/app.js"),
     },
   },
   css: {

resources/views/app.blade.php

@@ -25,7 +25,7 @@
  <script src="{{ asset('assets/js/tippy-bundle.umd.min.js') }}"></script>
  <link rel="stylesheet" href="{{ asset('assets/css/scale.min.css') }}"/>
 
- @vite(['resources/js/ssr.tsx', 'resources/themes/' . setting('theme', 'atom') . '/css/app.css', 'resources/themes/' . setting('theme', 'atom') . '/js/app.ts'], 'build')
+ @vite(['resources/js/ssr.jsx', 'resources/themes/' . setting('theme', 'atom') . '/css/app.css', 'resources/themes/' . setting('theme', 'atom') . '/js/app.js'], 'build')
 
  <style>
  :root {

resources/views/layouts/installation.blade.php

@@ -14,7 +14,7 @@
     <!-- Fonts -->
     <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap">
 
-    @vite(['resources/css/global.css', 'resources/js/global.ts'], 'build')
+    @vite(['resources/css/global.css', 'resources/js/global.js'], 'build')
     @stack('scripts')
 </head>
 

tsconfig.json

@@ -1,30 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ESNext",
-    "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "jsx": "react-jsx",
-    "strict": true,
-    "noUnusedLocals": false,
-    "noUnusedParameters": false,
-    "noFallthroughCasesInSwitch": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "forceConsistentCasingInFileNames": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "paths": {
-      "@/*": ["./resources/js/*"]
-    },
-    "types": ["vite/client"]
-  },
-  "include": [
-    "resources/js/**/*.ts",
-    "resources/js/**/*.tsx",
-    "resources/js/**/*.d.ts",
-    "resources/themes/atom/js/**/*.ts",
-    "resources/themes/dusk/js/**/*.ts"
-  ]
-}

vite.config.js

@@ -10,8 +10,8 @@ export default defineConfig({
     laravel({
       input: [
         "resources/css/global.css",
-        "resources/js/global.ts",
-        "resources/js/ssr.tsx",
+        "resources/js/global.js",
+        "resources/js/ssr.jsx",
         "resources/themes/atom/css/app.css",
         "resources/themes/atom/js/app.js",
         "resources/themes/dusk/css/app.css",

yarn.lock

@@ -241,7 +241,7 @@
   resolved "https://registry.yarnpkg.com/@esbuild/win32-x64/-/win32-x64-0.28.0.tgz#04d90d5752b4ce65d2b6ac25eba08ff7624fe07c"
   integrity sha512-pEl1bO9mfAmIC+tW5btTmrKaujg3zGtUmWNdCw/xs70FBjwAL3o9OEKNHvNmnyylD6ubxUERiEhdsL0xBQ9efw==
 
-"@eslint-community/eslint-utils@^4.8.0", "@eslint-community/eslint-utils@^4.9.1":
+"@eslint-community/eslint-utils@^4.4.0", "@eslint-community/eslint-utils@^4.8.0":
   version "4.9.1"
   resolved "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz"
   integrity sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==
@@ -911,124 +911,11 @@
   resolved "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz"
   integrity sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==
 
-"@types/lodash@^4.17.24":
-  version "4.17.24"
-  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.17.24.tgz#4ae334fc62c0e915ca8ed8e35dcc6d4eeb29215f"
-  integrity sha512-gIW7lQLZbue7lRSWEFql49QJJWThrTFFeIMJdp3eH4tKoxm1OvEPg02rm4wCCSHS0cL3/Fizimb35b7k8atwsQ==
-
-"@types/react-dom@^19.2.3":
-  version "19.2.3"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-19.2.3.tgz#c1e305d15a52a3e508d54dca770d202cb63abf2c"
-  integrity sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==
-
-"@types/react@^19.2.17":
-  version "19.2.17"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-19.2.17.tgz#dccac365baa0f1734ec270ff4b51c89465e8dc7f"
-  integrity sha512-MXfmqaVPEVgkBT/aY0aGCkRWWtByiYQXo3xdQ8r5RzuFrPiRn8Gar2tQdXSUQ2GKV3bkXckek89V8wQBY2Q/Aw==
-  dependencies:
-    csstype "^3.2.2"
-
 "@types/resolve@1.20.2":
   version "1.20.2"
   resolved "https://registry.npmjs.org/@types/resolve/-/resolve-1.20.2.tgz"
   integrity sha512-60BCwRFOZCQhDncwQdxxeOEEkbc5dIMccYLwbxsS4TUNeVECQ/pBJ0j09mrHOl/JJvpRPGwO9SvE4nR2Nb/a4Q==
 
-"@typescript-eslint/eslint-plugin@^8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.61.1.tgz#6e4b7fee21f1983308e9e9b634ecbaf702c86006"
-  integrity sha512-ZPlVl3PB3et/59Ne0fv/sci6ZXz4T4Hp4nTJ56i/Y0gR89ARb+KphojTq6j+56E5PIezmOIOOWyY+aWQFd+IkQ==
-  dependencies:
-    "@eslint-community/regexpp" "^4.12.2"
-    "@typescript-eslint/scope-manager" "8.61.1"
-    "@typescript-eslint/type-utils" "8.61.1"
-    "@typescript-eslint/utils" "8.61.1"
-    "@typescript-eslint/visitor-keys" "8.61.1"
-    ignore "^7.0.5"
-    natural-compare "^1.4.0"
-    ts-api-utils "^2.5.0"
-
-"@typescript-eslint/parser@^8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/parser/-/parser-8.61.1.tgz#881fba60b50636249cdeea2e547bf75715254c72"
-  integrity sha512-PJ5vePq5/ognBbrIcoC5+SHO5dfpeLPzP9FpLkzWrguoYQEeeSjlJpVwOpo1JRSTEi7dRcwNy4h4dzV70PqHcg==
-  dependencies:
-    "@typescript-eslint/scope-manager" "8.61.1"
-    "@typescript-eslint/types" "8.61.1"
-    "@typescript-eslint/typescript-estree" "8.61.1"
-    "@typescript-eslint/visitor-keys" "8.61.1"
-    debug "^4.4.3"
-
-"@typescript-eslint/project-service@8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/project-service/-/project-service-8.61.1.tgz#fcd9739964a40867eed55f1ac318d3909f24b4af"
-  integrity sha512-PrC4JYGmR241lYnfhmKGTXkFqv8+ymbTFgSAY0fVXpY82/QkMw5TZPl+vGzuDDU2QYJk9fIDOBTntF+yDv9LEA==
-  dependencies:
-    "@typescript-eslint/tsconfig-utils" "^8.61.1"
-    "@typescript-eslint/types" "^8.61.1"
-    debug "^4.4.3"
-
-"@typescript-eslint/scope-manager@8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/scope-manager/-/scope-manager-8.61.1.tgz#2479921a40fdb0afa18f5838fae6167264b417b2"
-  integrity sha512-L2bdIeoQS8FlKAvONAr20w6OcLXeB+qiDKbAooS9A0Ben+iSIkBef0FxqwKWYqt5sa0i4KJtxVyVmhMylKzF5w==
-  dependencies:
-    "@typescript-eslint/types" "8.61.1"
-    "@typescript-eslint/visitor-keys" "8.61.1"
-
-"@typescript-eslint/tsconfig-utils@8.61.1", "@typescript-eslint/tsconfig-utils@^8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.61.1.tgz#ca88080e0cf191d49516d7f300b67aa090d2254f"
-  integrity sha512-UN/H4di+OO7EWx2ovME+8t31YO+KVnK0RRKEHR3kOt21/Ay8BOq3M1OMvWs5vNiqcFCYGYoxK3MXPZzmMUE+yg==
-
-"@typescript-eslint/type-utils@8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/type-utils/-/type-utils-8.61.1.tgz#8fa18f453ee140893b47d339d1a6b64cac9b08a1"
-  integrity sha512-GYRicKmVK0C4fsKgaACaknOUAq9Oa2kwsjnpFhFcS/5p4Ht5IP9OVLbgIgcK4SRk92nVHFluurg1lumD9dBcLw==
-  dependencies:
-    "@typescript-eslint/types" "8.61.1"
-    "@typescript-eslint/typescript-estree" "8.61.1"
-    "@typescript-eslint/utils" "8.61.1"
-    debug "^4.4.3"
-    ts-api-utils "^2.5.0"
-
-"@typescript-eslint/types@8.61.1", "@typescript-eslint/types@^8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/types/-/types-8.61.1.tgz#0c51f518e4e6848371a1c988e859d59eb7522d5a"
-  integrity sha512-G+CRlPqLv7Bz1IZVs03x5K59F1veqL0EJUROAdGhKsEq8qOiRiZbI+HUojPq5l0fEGOKModD9br6lObhB8zkoA==
-
-"@typescript-eslint/typescript-estree@8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/typescript-estree/-/typescript-estree-8.61.1.tgz#febbe70365ac0bf7611262b61b338fc8797965c7"
-  integrity sha512-u+oQD3BqYWPc8YV9Zab4vaJElJuwOLPRc10Jm1o/qS+6Qwen14HCWwx0Seo4LnSn2wxea2Ik8DxPt2/FHmuhrg==
-  dependencies:
-    "@typescript-eslint/project-service" "8.61.1"
-    "@typescript-eslint/tsconfig-utils" "8.61.1"
-    "@typescript-eslint/types" "8.61.1"
-    "@typescript-eslint/visitor-keys" "8.61.1"
-    debug "^4.4.3"
-    minimatch "^10.2.2"
-    semver "^7.7.3"
-    tinyglobby "^0.2.15"
-    ts-api-utils "^2.5.0"
-
-"@typescript-eslint/utils@8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/utils/-/utils-8.61.1.tgz#ffd1054de7dd33b7873cd6c6713ec6b0366316d3"
-  integrity sha512-1+P/3Dj6jvtybE1q0HQ6yBt/gq+oKJyLdEv4HdnqasaEXRSYCAsD59mXEVQnM/ULNdQxbX77tdG4jPRjIS6knA==
-  dependencies:
-    "@eslint-community/eslint-utils" "^4.9.1"
-    "@typescript-eslint/scope-manager" "8.61.1"
-    "@typescript-eslint/types" "8.61.1"
-    "@typescript-eslint/typescript-estree" "8.61.1"
-
-"@typescript-eslint/visitor-keys@8.61.1":
-  version "8.61.1"
-  resolved "https://registry.yarnpkg.com/@typescript-eslint/visitor-keys/-/visitor-keys-8.61.1.tgz#546cf102b4efdb72a9a08e63a1b0d7d745eb66eb"
-  integrity sha512-6fJ9MHWtK14C1DSkiMlHUSOmrVebL7150xZJBlJiL62jjhIA4JmOq6flwBgDxIdBKKdoiZRel+dfPD5MLfny3w==
-  dependencies:
-    "@typescript-eslint/types" "8.61.1"
-    eslint-visitor-keys "^5.0.0"
-
 "@vitejs/plugin-react@^6.0.2":
   version "6.0.2"
   resolved "https://registry.yarnpkg.com/@vitejs/plugin-react/-/plugin-react-6.0.2.tgz#f70cb8ed0ce225dbc3055d78070f820d8aa35eda"
@@ -1232,6 +1119,11 @@ blade-formatter@1.44.4:
     xregexp "^5.0.1"
     yargs "^17.3.1"
 
+boolbase@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
+  integrity sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==
+
 brace-expansion@^2.0.2:
   version "2.0.3"
   resolved "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.3.tgz"
@@ -1441,11 +1333,6 @@ cssesc@^3.0.0:
   resolved "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz"
   integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
 
-csstype@^3.2.2:
-  version "3.2.3"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.2.3.tgz#ec48c0f3e993e50648c86da559e2610995cf989a"
-  integrity sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==
-
 debug@4, debug@^4.3.1, debug@^4.3.2, debug@^4.4.3:
   version "4.4.3"
   resolved "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz"
@@ -1621,6 +1508,18 @@ escape-string-regexp@^4.0.0:
   resolved "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz"
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
+eslint-plugin-vue@10.9.2:
+  version "10.9.2"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-10.9.2.tgz#571a3e1d826628f078094a748c9d4df49ad18668"
+  integrity sha512-4g7ZP3pYcuqd7Zp0pzUKcos0W+RkjBz4EGdhJ92FcYk6v03Ti/GK5NwjgsjxHK+98eXDbHeK7VtX1az7/8doZA==
+  dependencies:
+    "@eslint-community/eslint-utils" "^4.4.0"
+    natural-compare "^1.4.0"
+    nth-check "^2.1.1"
+    postcss-selector-parser "^7.1.0"
+    semver "^7.6.3"
+    xml-name-validator "^4.0.0"
+
 eslint-scope@^9.1.2:
   version "9.1.2"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-9.1.2.tgz#b9de6ace2fab1cff24d2e58d85b74c8fcea39802"
@@ -1636,7 +1535,7 @@ eslint-visitor-keys@^3.4.3:
   resolved "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz"
   integrity sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==
 
-eslint-visitor-keys@^5.0.0, eslint-visitor-keys@^5.0.1:
+eslint-visitor-keys@^5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz#9e3c9489697824d2d4ce3a8ad12628f91e9f59be"
   integrity sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==
@@ -1971,11 +1870,6 @@ global-prefix@^3.0.0:
     kind-of "^6.0.2"
     which "^1.3.1"
 
-globals@^17.6.0:
-  version "17.6.0"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-17.6.0.tgz#0f0be018d5cca8690e6375ead1f65c4bb96191fc"
-  integrity sha512-sepffkT8stwnIYbsMBpoCHJuJM5l98FUF2AnE07hfvE0m/qp3R586hw4jF4uadbhvg1ooIdzuu7CsfD2jzCaNA==
-
 globby@^16.2.0:
   version "16.2.0"
   resolved "https://registry.yarnpkg.com/globby/-/globby-16.2.0.tgz#6ab1351fbac1d9b9e47ed423814c2ad41af308ea"
@@ -2534,6 +2428,13 @@ normalize-path@^3.0.0, normalize-path@~3.0.0:
   resolved "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz"
   integrity sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==
 
+nth-check@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz"
+  integrity sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==
+  dependencies:
+    boolbase "^1.0.0"
+
 object-assign@^4.0.1:
   version "4.1.1"
   resolved "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz"
@@ -2723,7 +2624,7 @@ postcss-selector-parser@^6.1.1, postcss-selector-parser@^6.1.2:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
 
-postcss-selector-parser@^7.1.1:
+postcss-selector-parser@^7.1.0, postcss-selector-parser@^7.1.1:
   version "7.1.1"
   resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-7.1.1.tgz#e75d2e0d843f620e5df69076166f4e16f891cb9f"
   integrity sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==
@@ -2922,16 +2823,11 @@ scheduler@^0.27.0:
   resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.27.0.tgz#0c4ef82d67d1e5c1e359e8fc76d3a87f045fe5bd"
   integrity sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==
 
-semver@^7.5.3:
+semver@^7.5.3, semver@^7.6.3:
   version "7.7.4"
   resolved "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz"
   integrity sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==
 
-semver@^7.7.3:
-  version "7.8.4"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.8.4.tgz#c73eceebae0616934be8dff28a7fd70757c8e696"
-  integrity sha512-rUCObTnP32Q08R2uuIrt7r9PlEonuTmtuXYcW6s5kjdlj3xbnwe+21yXptAUYcMAABLkYYTtnmzb3w3EDZfueA==
-
 shebang-command@^2.0.0:
   version "2.0.0"
   resolved "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz"
@@ -3213,7 +3109,7 @@ tinyglobby@^0.2.11, tinyglobby@^0.2.12:
     fdir "^6.5.0"
     picomatch "^4.0.3"
 
-tinyglobby@^0.2.15, tinyglobby@^0.2.17:
+tinyglobby@^0.2.17:
   version "0.2.17"
   resolved "https://registry.yarnpkg.com/tinyglobby/-/tinyglobby-0.2.17.tgz#562a9a6c9eb2b3b123d39719f9af5bb44fcd7631"
   integrity sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==
@@ -3228,11 +3124,6 @@ to-regex-range@^5.0.1:
   dependencies:
     is-number "^7.0.0"
 
-ts-api-utils@^2.5.0:
-  version "2.5.0"
-  resolved "https://registry.yarnpkg.com/ts-api-utils/-/ts-api-utils-2.5.0.tgz#4acd4a155e22734990a5ed1fe9e97f113bcb37c1"
-  integrity sha512-OJ/ibxhPlqrMM0UiNHJ/0CKQkoKF243/AEmplt3qpRgkW8VG7IfOS41h7V8TjITqdByHzrjcS/2si+y4lIh8NA==
-
 ts-interface-checker@^0.1.9:
   version "0.1.13"
   resolved "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz"
@@ -3260,11 +3151,6 @@ typedarray@^0.0.6:
   resolved "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz"
   integrity sha512-/aCDEGatGvZ2BIk+HmLf4ifCJFwvKFNb9/JeZPMulfgFracn9QFcAf5GO8B/mweUjSoblS5In0cWhqpfs/5PQA==
 
-typescript@^6.0.3:
-  version "6.0.3"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-6.0.3.tgz#90251dc007916e972786cb94d74d15b185577d21"
-  integrity sha512-y2TvuxSZPDyQakkFRPZHKFm+KKVqIisdg9/CZwm9ftvKXLP8NRWj38/ODjNbr43SsoXqNuAisEf1GdCxqWcdBw==
-
 unicorn-magic@^0.4.0:
   version "0.4.0"
   resolved "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.4.0.tgz"
@@ -3381,6 +3267,11 @@ write-file-atomic@^7.0.1:
   dependencies:
     signal-exit "^4.0.1"
 
+xml-name-validator@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-4.0.0.tgz"
+  integrity sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==
+
 xregexp@^5.0.1:
   version "5.1.2"
   resolved "https://registry.npmjs.org/xregexp/-/xregexp-5.1.2.tgz"