fix: Type errors

.eslintrc.cjs

@@ -4,7 +4,7 @@ module.exports = {
   extends: [
     'eslint:recommended',
     'plugin:@typescript-eslint/recommended',
-    // 'plugin:@typescript-eslint/recommended-requiring-type-checking',
+    'plugin:@typescript-eslint/recommended-requiring-type-checking',
     'prettier'
   ],
   plugins: ['svelte3', 'tailwindcss', '@typescript-eslint', 'es', 'vitest'],

src/lib/components/Actions.svelte

@@ -166,8 +166,7 @@
   if (browser && ['mermaid.live', 'netlify'].some((path) => window.location.host.includes(path))) {
     isNetlify = true;
   }
-  stateStore.subscribe(async (state) => {
-    const { code, serialized } = await state;
+  stateStore.subscribe(({ code, serialized }) => {
     iUrl = `${rendererUrl}/img/${serialized}?type=png`;
     svgUrl = `${rendererUrl}/svg/${serialized}`;
     krokiUrl = `${krokiRendererUrl}/mermaid/svg/${pakoSerde.serialize(code)}`;

src/lib/components/Editor.svelte

@@ -74,6 +74,7 @@
 
   onMount(async () => {
     await loadMonaco(); // Fix https://github.com/mermaid-js/mermaid-live-editor/issues/175
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-call
     initEditor(Monaco);
     errorDebug(100);
     editor = Monaco.editor.create(divEl, editorOptions);

src/lib/components/History/History.svelte

@@ -14,7 +14,7 @@
   import { onMount } from 'svelte';
   import { get } from 'svelte/store';
   import moment from 'moment';
-  import type { HistoryType, State, Tab } from '$lib/types';
+  import type { HistoryEntry, HistoryType, State, Tab } from '$lib/types';
   import { logEvent } from '$lib/util/stats';
 
   const HISTORY_SAVE_INTERVAL = 60000;
@@ -60,7 +60,7 @@
       }
       const reader = new FileReader();
       reader.onload = (e) => {
-        const data = JSON.parse(e.target.result as string);
+        const data: HistoryEntry[] = JSON.parse(e.target.result as string);
         restoreHistory(data);
       };
       reader.readAsText(file);

src/lib/components/Navbar.svelte

@@ -1,7 +1,7 @@
-<script context="module">
+<script context="module" lang="ts">
   import { version } from 'mermaid/package.json';
   import { analytics } from '$lib/util/stats';
-  analytics?.track('version', {
+  void analytics?.track('version', {
     mermaidVersion: version
   });
 </script>

src/lib/components/Preset.svelte

@@ -104,7 +104,8 @@
       Mermaid`
   };
 
-  const loadSampleDiagram = (diagramType: string): void => {
+  type SampleTypes = keyof typeof samples;
+  const loadSampleDiagram = (diagramType: SampleTypes): void => {
     updateCode(samples[diagramType], {
       updateDiagram: true,
       resetPanZoom: true
@@ -113,8 +114,8 @@
   };
 
   // Adding in this array will add an icon to the preset menu
-  const newDiagrams: Array<keyof typeof samples> = ['Mindmap'];
-  const diagramOrder: Array<keyof typeof samples> = [
+  const newDiagrams: Array<SampleTypes> = ['Mindmap'];
+  const diagramOrder: Array<SampleTypes> = [
     'Sequence',
     'Flow',
     'Class',

src/lib/components/Theme.svelte

@@ -1,4 +1,4 @@
-<script>
+<script lang="ts">
   import { setTheme, themeStore } from '$lib/util/theme';
 
   const themes = [
@@ -24,6 +24,10 @@
     '💎 luxury',
     '🧛‍♂️ dracula'
   ];
+
+  function checkTheme(theme: string) {
+    return theme.includes($themeStore.theme);
+  }
 </script>
 
 <div class="hidden lg:block dropdown">
@@ -52,7 +56,7 @@
     <!-- svelte-ignore a11y-no-noninteractive-tabindex -->
     <ul tabindex="0" class="p-4 menu compact">
       {#each themes as theme}
-        <li class={theme.includes($themeStore.theme) ? 'bordered' : ''}>
+        <li class:bordered={checkTheme(theme)}>
           <span
             class="btn btn-ghost justify-start"
             on:click={() => setTheme(theme)}

src/lib/components/View.svelte

@@ -6,6 +6,7 @@
   import { logEvent } from '$lib/util/stats';
   import { AsyncQueue, cmdKey } from '$lib/util/util';
   import { render as renderDiagram } from '$lib/util/mermaid';
+  import type { MermaidConfig } from 'mermaid';
 
   let code = '';
   let config = '';
@@ -32,7 +33,7 @@
     hide = true;
     pzoom?.destroy();
     pzoom = undefined;
-    Promise.resolve().then(() => {
+    void Promise.resolve().then(() => {
       const graphDiv = document.getElementById('graph-div');
       pzoom = panzoom(graphDiv, {
         onPan: handlePanZoomChange,
@@ -73,7 +74,7 @@
         const scroll = view.parentElement.scrollTop;
         delete container.dataset.processed;
         await renderDiagram(
-          Object.assign({}, JSON.parse(state.mermaid)),
+          Object.assign({}, JSON.parse(state.mermaid)) as MermaidConfig,
           code,
           'graph-div',
           (svgCode, bindFunctions) => {
@@ -106,8 +107,8 @@
   const q = new AsyncQueue(handleStateChange);
 
   onMount(() => {
-    stateStore.subscribe(async (state) => {
-      await q.process(state);
+    stateStore.subscribe((state) => {
+      void q.process(state);
     });
     window.addEventListener('resize', () => {
       if ($stateStore.panZoom && pzoom) {

src/lib/util/fileLoaders/gist.ts

@@ -9,11 +9,17 @@ import { addHistoryEntry } from '$lib/components/History/History';
 const codeFileName = 'code.mmd';
 const configFileName = 'config.json';
 
+interface GithubFile {
+  truncated: boolean;
+  raw_url: string;
+  content: string;
+}
+
 const isValidGist = (files: any): boolean => {
   return codeFileName in files;
 };
 
-const getFileContent = async (file: any): Promise<string> => {
+const getFileContent = async (file: GithubFile): Promise<string> => {
   if (file.truncated) {
     return await (await fetch(file.raw_url)).text();
   }
@@ -29,11 +35,17 @@ interface GistData {
   url: string;
 }
 
+interface GistResponse {
+  files: Record<string, GithubFile>;
+  html_url: string;
+  history: { url: string; committed_at: string; version: string; user: { login: string } }[];
+}
+
 const getGistData = async (gistURL: string): Promise<GistData> => {
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const [_, __, gistID, revisionID] = gistURL.split('github.com').pop().split('/');
   // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-  const { html_url, files, history } = await (
+  const { html_url, files, history }: GistResponse = await (
     await fetch(`https://api.github.com/gists/${gistID}${revisionID ? '/' + revisionID : ''}`)
   ).json();
   if (isValidGist(files)) {
@@ -50,7 +62,7 @@ const getGistData = async (gistURL: string): Promise<GistData> => {
       config,
       author: currentItem.user.login,
       time: new Date(currentItem.committed_at).getTime(),
-      version: (currentItem.version as string).slice(-7)
+      version: currentItem.version.slice(-7)
     };
   } else {
     throw 'Invalid gist provided';
@@ -77,7 +89,7 @@ export const loadGistData = async (gistURL: string): Promise<State> => {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const [_, __, gistID, revisionID] = gistURL.split('github.com').pop().split('/');
     // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-    const { history } = await (
+    const { history }: GistResponse = await (
       await fetch(`https://api.github.com/gists/${gistID}${revisionID ? '/' + revisionID : ''}`)
     ).json();
     const gistHistory: GistData[] = [];

src/lib/util/mermaid.ts

@@ -23,5 +23,5 @@ export const render = async (
 
 export const parse = async (code: string): Promise<boolean> => {
   await init();
-  return (await mermaid.parseAsync(code)) as boolean;
+  return await mermaid.parseAsync(code);
 };

src/lib/util/persist.ts

@@ -45,7 +45,7 @@ const alreadyWarnFor: Array<string> = [];
  * Add a log to indicate that the requested Storage have not been found.
  * @param {string} storageName
  */
-const warnStorageNotFound = (storageName) => {
+const warnStorageNotFound = (storageName: string) => {
   const isProduction = typeof process !== 'undefined' && process.env?.NODE_ENV === 'production';
 
   if (!noWarnings && alreadyWarnFor.indexOf(storageName) === -1 && !isProduction) {
@@ -237,7 +237,7 @@ function getBrowserStorage(
 
 /**
  * Storage implementation that use the browser local storage
- * @param {boolean} listenExternalChanges - Update the store if the localStorage is updated from another page
+ * @param listenExternalChanges - Update the store if the localStorage is updated from another page
  */
 export function localStorage<T>(listenExternalChanges = false): StorageInterface<T> {
   if (typeof window !== 'undefined' && window?.localStorage) {
@@ -250,7 +250,7 @@ export function localStorage<T>(listenExternalChanges = false): StorageInterface
 /**
  * Storage implementation that do nothing
  */
-export function noopStorage(): StorageInterface<any> {
+export function noopStorage<T>(): StorageInterface<T> {
   return {
     getValue(): null {
       return null;

src/lib/util/state.ts

@@ -6,6 +6,8 @@ import { cmdKey, errorDebug, AsyncQueue } from './util';
 import { parse } from './mermaid';
 
 import type { MarkerData, State, ValidatedState } from '$lib/types';
+import type { MermaidConfig } from 'mermaid';
+
 export const defaultState: State = {
   code: `graph TD
     A[Christmas] -->|Get money| B(Go shopping)
@@ -99,7 +101,7 @@ export const stateStore: Readable<ValidatedState> = derived(
         set(newState);
       });
     }
-    q.process(state);
+    void q.process(state);
   },
   currentState
 );
@@ -180,7 +182,7 @@ export const updateConfig = (config: string): void => {
 
 export const toggleDarkTheme = (dark: boolean): void => {
   inputStateStore.update((state) => {
-    const config = JSON.parse(state.mermaid);
+    const config: MermaidConfig = JSON.parse(state.mermaid);
     if (!config.theme || ['dark', 'default'].includes(config.theme)) {
       config.theme = dark ? 'dark' : 'default';
     }

src/lib/util/util.ts

@@ -23,7 +23,7 @@ export const initHandler = async (): Promise<void> => {
   syncDiagram();
   initURLSubscription();
   await initAnalytics();
-  analytics?.page();
+  await analytics?.page();
 };
 
 export const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;

src/routes/+layout.svelte

@@ -10,8 +10,8 @@
   // This can be removed once https://github.com/sveltejs/kit/issues/1612 is fixed.
   // Then move it into src and vite will bundle it automatically.
   onMount(() => {
-    window.addEventListener('hashchange', async () => {
-      await initHandler();
+    window.addEventListener('hashchange', () => {
+      void initHandler();
     });
     if ('serviceWorker' in navigator) {
       navigator.serviceWorker