chore(deps): Update dependencies

.gitignore

@@ -7,3 +7,4 @@ dist
 .env*
 !.env.example
 .vercel
+.idea

package.json

@@ -20,6 +20,9 @@
     "fmt:check": "prettier --check '**/*.{ts,tsx,json}'",
     "typecheck": "cd packages/client && pnpm run typecheck"
   },
+  "devDependencies": {
+    "eslint": "^8.49.0"
+  },
   "keywords": [],
   "engines": {
     "node": ">=16",

packages/client/codegen.plugin.ts

@@ -12,7 +12,7 @@ const directiveRegex = new RegExp("use:(" + DIRECTIVES.join("|") + ")");
 export default function codegenPlugin() {
   return {
     name: "codegen",
-    enforce: "pre",
+    enforce: "pre" as const,
     transform(src: string, id: string) {
       if (fileRegex.test(id)) {
         src = src.replace(codegenRegex, (substring, group1) => {

packages/client/components/app/interface/settings/user/Account.tsx

@@ -1,5 +1,5 @@
 import {
-  Accessor,
+  type Accessor,
   Match,
   Show,
   Switch,
@@ -41,7 +41,7 @@ import MdVerifiedUser from "@material-design-icons/svg/outlined/verified_user.sv
 
 import { useSettingsNavigation } from "../Settings";
 
-import { UserSummary } from "./account";
+import { UserSummary } from "./account/index";
 
 /**
  * Account Page

packages/client/components/app/interface/settings/user/Language.tsx

@@ -4,7 +4,7 @@ import {
   Languages,
   browserPreferredLanguage,
   language,
-  loadAndSetLanguage,
+  setLanguage,
   useTranslation,
 } from "@revolt/i18n";
 import { UnicodeEmoji } from "@revolt/markdown/emoji";
@@ -101,7 +101,7 @@ function PickLanguage() {
           <CategoryButton
             icon={<UnicodeEmoji emoji={lang.emoji} />}
             action={<Checkbox value={id === language()} />}
-            onClick={() => loadAndSetLanguage(id as never)}
+            onClick={() => setLanguage(id as never)}
           >
             <Row>
               {lang.display}{" "}

packages/client/components/app/interface/settings/user/bots/ViewBot.tsx

@@ -13,7 +13,7 @@ import MdPublic from "@material-design-icons/svg/outlined/public.svg?component-s
 import MdToken from "@material-design-icons/svg/outlined/token.svg?component-solid";
 
 import { useSettingsNavigation } from "../../Settings";
-import { UserSummary } from "../account";
+import { UserSummary } from "../account/index";
 import { EditProfileButtons } from "../profile/EditProfileButtons";
 
 /**

packages/client/components/app/interface/settings/user/profile/EditProfile.tsx

@@ -14,7 +14,7 @@ import {
 
 import MdGroups from "@material-design-icons/svg/outlined/groups.svg?component-solid";
 
-import { UserSummary } from "../account";
+import { UserSummary } from "../account/index";
 
 import { EditProfileButtons } from "./EditProfileButtons";
 

packages/client/components/auth/src/AuthPage.tsx

@@ -10,7 +10,6 @@ import MdDarkMode from "@material-design-icons/svg/filled/dark_mode.svg?componen
 
 import background from "./background.jpg";
 import { FlowBase } from "./flows/Flow";
-
 /**
  * Authentication page layout
  */

packages/client/components/i18n/index.tsx

@@ -1,49 +1,50 @@
-import { createSignal } from "solid-js";
-
-import { createI18nContext, useI18n } from "@solid-primitives/i18n";
-import defaultsDeep from "lodash.defaultsdeep";
+import { createContext, createSignal, useContext, useTransition } from "solid-js";
+import * as i18n from '@solid-primitives/i18n';
 
 import { Language, Languages } from "./locales/Languages";
 import en from "./locales/en.json";
 
 export { Language, Languages } from "./locales/Languages";
-export { I18nContext, useI18n } from "@solid-primitives/i18n";
 export * from "./dayjs";
 
 /**
  * Default dictionary object
  */
-const dict = {
+export const dict = {
   en,
 };
 
+export type RawDictionary = typeof dict.en;
+export type Dictionary = i18n.Flatten<RawDictionary>;
+
 /**
  * Currently set language
  */
-const [language, setLanguage] = createSignal<Language>("en" as Language);
+const [language, _setLanguage] = createSignal<Language>("en" as Language);
 export { language };
 
-/**
- * i18n Context
- */
-const context = createI18nContext(dict, "en");
-export default context;
-
 /**
  * Use translation function as a hook
  */
-export const useTranslation = () => useI18n()[0];
+
+export const I18nContext = createContext(i18n.translator(() => i18n.flatten(dict.en), i18n.resolveTemplate))
+
+export const useTranslation = () => useContext(I18nContext);
+
+const [duringI18nTransition, startI18nTransition] = useTransition();
+
+export { duringI18nTransition };
+
+export async function fetchLanguage(key: Language): Promise<Dictionary> {
+  const data = await import(`./locales/${Languages[key].i18n}.json`) as typeof dict.en;
+  return i18n.flatten(data)
+}
 
 /**
- * Load and set a language by the given key
+ * set a language by the given key
  */
-export async function loadAndSetLanguage(key: Language) {
-  if (language() === key) return;
-  setLanguage(key);
-
-  const data = await import(`./locales/${Languages[key].i18n}.json`);
-  context[1].add(key, defaultsDeep({}, data, en));
-  context[1].locale(key);
+export function setLanguage(key: Language) {
+  startI18nTransition(() => _setLanguage(key));
 }
 
 /**
@@ -74,7 +75,7 @@ export function browserPreferredLanguage() {
  */
 export const useQuantity = () => {
   const t = useTranslation();
-  return (id: string, count: number) =>
+  return (id: 'members' | 'dropFiles', count: number) =>
     t(`quantities.${id}.${count > 1 ? "many" : "one"}`, {
       count: count.toString(),
     });

packages/client/components/markdown/sanitise.ts

@@ -1,5 +1,3 @@
-import { Root } from "hast";
-
 /**
  * Regex for matching execessive recursion of blockquotes and lists
  */
@@ -61,7 +59,7 @@ export function sanitise(content: string) {
  * Replace \uF800 with break elements
  */
 export function remarkInsertBreaks() {
-  return (tree: Root) => {
+  return (tree: import('hast').Root) => {
     /**
      * Process element and sub-tree
      * @param element Element

packages/client/components/routing/index.tsx

@@ -1,4 +1,4 @@
-import { Accessor } from "solid-js";
+import { type Accessor } from "solid-js";
 
 import { useLocation } from "@solidjs/router";
 

packages/client/components/state/stores/Locale.ts

@@ -2,7 +2,7 @@ import {
   Language,
   Languages,
   browserPreferredLanguage,
-  loadAndSetLanguage,
+  setLanguage,
 } from "@revolt/i18n";
 
 import { State } from "..";
@@ -32,7 +32,7 @@ export class Locale extends AbstractStore<"locale", TypeLocale> {
    * Hydrate external context
    */
   hydrate(): void {
-    loadAndSetLanguage(this.get().lang);
+    setLanguage(this.get().lang);
   }
 
   /**

packages/client/components/ui/components/common/Draggable.tsx

@@ -66,7 +66,6 @@ export function Draggable<T>(props: Props<T>) {
    */
   return (
     <div
-      // @ts-expect-error Typescript doesn't support directives
       use:dndzone={{ items: containerItems }}
       on:consider={handleDndEvent}
       on:finalize={handleDndEvent}

packages/client/components/ui/directives/floating.ts

@@ -1,4 +1,4 @@
-import { Accessor, JSX, createSignal, onCleanup } from "solid-js";
+import { type Accessor, type JSX, createSignal, onCleanup } from "solid-js";
 
 type Props = JSX.Directives["floating"] & object;
 

packages/client/components/ui/directives/scrollable.ts

@@ -1,4 +1,4 @@
-import { Accessor, JSX, onCleanup } from "solid-js";
+import { type Accessor, type JSX, onCleanup } from "solid-js";
 import { css, useTheme } from "solid-styled-components";
 
 /**

packages/client/package.json

@@ -16,97 +16,96 @@
     "build-storybook": "storybook build"
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^1.5.0",
-    "@pandacss/dev": "^0.35.0",
+    "@chromatic-com/storybook": "^2.0.2",
+    "@pandacss/dev": "^0.46.1",
     "@solid-devtools/transform": "^0.10.4",
-    "@solidjs/testing-library": "^0.8.6",
-    "@storybook/addon-essentials": "8.2.0-alpha.5",
-    "@storybook/addon-interactions": "8.2.0-alpha.5",
-    "@storybook/addon-links": "8.2.0-alpha.5",
-    "@storybook/blocks": "8.2.0-alpha.5",
-    "@storybook/html": "^8.1.6",
+    "@solidjs/testing-library": "^0.8.10",
+    "@storybook/addon-essentials": "8.3.5",
+    "@storybook/addon-interactions": "8.3.5",
+    "@storybook/addon-links": "8.3.5",
+    "@storybook/blocks": "8.3.5",
+    "@storybook/html": "^8.3.5",
     "@storybook/testing-library": "^0.2.2",
-    "@testing-library/jest-dom": "^6.4.2",
+    "@testing-library/jest-dom": "^6.5.0",
     "@types/hast": "^3.0.4",
     "@types/lodash.defaultsdeep": "^4.6.9",
     "@types/lodash.isequal": "^4.5.8",
-    "@types/unist": "^3.0.2",
-    "@vitest/coverage-v8": "^1.6.0",
+    "@types/unist": "^3.0.3",
+    "@vitest/coverage-v8": "^2.1.2",
     "babel-plugin-codegen": "^4.1.5",
-    "jsdom": "^24.0.0",
+    "jsdom": "^25.0.1",
     "lnk": "^1.1.0",
-    "rehype-stringify": "^10.0.0",
+    "rehype-stringify": "^10.0.1",
     "revolt.js": "workspace:^",
-    "storybook": "8.2.0-alpha.5",
-    "storybook-solidjs": "^1.0.0-beta.2",
-    "storybook-solidjs-vite": "^1.0.0-beta.2",
-    "typescript": "^5.4.2",
-    "vite": "^5.1.6",
-    "vite-plugin-inspect": "^0.8.3",
-    "vite-plugin-pwa": "^0.19.4",
+    "storybook": "8.3.5",
+    "storybook-solidjs": "1.0.0-beta.2",
+    "storybook-solidjs-vite": "1.0.0-beta.2",
+    "typescript": "^5.6.3",
+    "vite": "^5.4.8",
+    "vite-plugin-inspect": "^0.8.7",
+    "vite-plugin-pwa": "^0.20.5",
     "vite-plugin-solid": "^2.10.2",
-    "vite-plugin-solid-svg": "^0.8.0",
-    "vitest": "^1.4.0"
+    "vite-plugin-solid-svg": "^0.8.1",
+    "vitest": "^2.1.2"
   },
   "dependencies": {
-    "@floating-ui/dom": "^1.6.3",
-    "@fontsource/inter": "^5.0.17",
-    "@fontsource/jetbrains-mono": "^5.0.19",
-    "@fontsource/open-sans": "^5.0.27",
+    "@floating-ui/dom": "^1.6.11",
+    "@fontsource/inter": "^5.1.0",
+    "@fontsource/jetbrains-mono": "^5.1.1",
+    "@fontsource/open-sans": "^5.1.0",
     "@material-design-icons/svg": "^0.14.13",
-    "@material/material-color-utilities": "^0.2.7",
+    "@material/material-color-utilities": "^0.3.0",
     "@minht11/solid-virtual-container": "^0.2.1",
     "@motionone/solid": "^10.16.4",
-    "@sentry/browser": "^7.107.0",
-    "@sentry/tracing": "^7.107.0",
+    "@sentry/browser": "^8.33.1",
+    "@sentry/tracing": "^7.114.0",
     "@solid-aria/button": "^0.1.3",
-    "@solid-devtools/debugger": "^0.23.3",
-    "@solid-devtools/overlay": "^0.29.3",
-    "@solid-primitives/i18n": "^1.1.1",
+    "@solid-devtools/debugger": "^0.23.4",
+    "@solid-devtools/overlay": "^0.30.1",
+    "@solid-primitives/i18n": "^2.1.1",
     "@solid-primitives/keyed": "^1.2.2",
-    "@solid-primitives/map": "^0.4.11",
-    "@solidjs/router": "^0.13.0",
-    "@tanstack/solid-query": "^5.48.0",
-    "@tauri-apps/api": "^1.5.3",
+    "@solid-primitives/map": "^0.4.13",
+    "@solidjs/router": "^0.14.7",
+    "@tanstack/solid-query": "^5.59.0",
+    "@tauri-apps/api": "^2.0.2",
     "@thisbeyond/solid-dnd": "^0.7.5",
     "color-rgba": "^3.0.0",
     "comma-separated-tokens": "^2.0.3",
-    "dayjs": "^1.11.10",
+    "dayjs": "^1.11.13",
     "detect-browser": "^5.3.0",
-    "emoji-regex": "^10.3.0",
+    "emoji-regex": "^10.4.0",
     "fast-deep-equal": "^3.1.3",
-    "hast": "^1.0.0",
     "json-stringify-deterministic": "^1.0.12",
-    "katex": "^0.16.9",
+    "katex": "^0.16.11",
     "localforage": "^1.10.0",
     "lodash.defaultsdeep": "^4.6.1",
     "lodash.isequal": "^4.5.0",
-    "mdast-util-to-hast": "^12.2.4",
-    "property-information": "^6.2.0",
+    "mdast-util-to-hast": "^13.2.0",
+    "property-information": "^6.5.0",
     "rehype-highlight": "^7.0.0",
-    "rehype-katex": "^7.0.0",
+    "rehype-katex": "^7.0.1",
     "rehype-prism": "^2.3.2",
     "remark-breaks": "^4.0.0",
     "remark-gfm": "^4.0.0",
     "remark-math": "^6.0.0",
     "remark-parse": "^11.0.0",
-    "remark-rehype": "^11.1.0",
+    "remark-rehype": "^11.1.1",
     "revolt.js": "workspace:^",
-    "shiki": "^1.9.0",
+    "shiki": "^1.22.0",
     "solid-dnd-directive": "^0.2.0",
     "solid-floating-ui": "^0.3.1",
     "solid-hcaptcha": "^0.4.0",
     "solid-icons": "^1.1.0",
-    "solid-js": "^1.8.15",
+    "solid-js": "^1.9.2",
     "solid-qr-code": "^0.1.11",
-    "solid-styled-components": "workspace:^0.28.5",
+    "solid-styled-components": "workspace:^",
     "space-separated-tokens": "^2.0.2",
-    "style-to-object": "^0.4.4",
+    "style-to-object": "^1.0.8",
     "ulid": "^2.3.0",
-    "unified": "^11.0.4",
+    "unified": "^11.0.5",
     "unist-util-visit": "^5.0.0",
-    "vfile": "^6.0.1",
-    "workbox-precaching": "^7.0.0"
+    "vfile": "^6.0.3",
+    "workbox-precaching": "^7.1.0"
   },
   "private": true
 }

packages/client/src/globals.d.ts

@@ -1,7 +1,17 @@
+import { type SolidOptions } from "solid-dnd-directive";
+
 export { };
 
 declare global {
   interface Window {
     __TAURI__: Object;
   }
+}
+
+declare module "solid-js" {
+  namespace JSX {
+    interface Directives {
+      dndzone: SolidOptions
+    }
+  }
 }