fix the runes export (#6793)

frontend/app/src/components/App.svelte

@@ -117,7 +117,8 @@
 
         window.addEventListener("orientationchange", calculateHeight);
         window.addEventListener("unhandledrejection", unhandledError);
-        (<any>window).platformModerator = {
+        //@ts-ignore
+        window.platformModerator = {
             addHotGroupExclusion,
             deleteFrozenGroup,
             deleteMessage,
@@ -130,7 +131,8 @@
             removeMessageFilter,
             reportedMessages,
         };
-        (<any>window).platformOperator = {
+        //@ts-ignore
+        window.platformOperator = {
             addRemoveSwapProvider,
             setGroupUpgradeConcurrency,
             setCommunityUpgradeConcurrency,

frontend/app/src/components/calendar/Calendar.svelte

@@ -8,32 +8,29 @@
     import { type Snippet } from "svelte";
     import { translationCodes } from "../../i18n/i18n";
     import { weekDays } from "./weekdays";
-    import { calendarState, type DateRange } from "./calendarState.svelte.ts"
+    import { calendarState, type DateRange } from "./calendarState.svelte";
 
     interface Props {
         monthTitleTemplate?: Snippet;
         dayTemplate?: Snippet<[Date]>;
-        dateSelected?: (range: DateRange) => void
+        dateSelected?: (range: DateRange) => void;
     }
 
-    let {
-        monthTitleTemplate,
-        dayTemplate,
-        dateSelected,
-    }: Props = $props();
+    let { monthTitleTemplate, dayTemplate, dateSelected }: Props = $props();
 
     let today = $state(new Date());
     let showDate = $state(new Date());
     let dates = $state<Date[][]>([]);
     let translatedLocale = $derived(translationCodes[$locale || "en"] || "en");
 
-    $effect(() => getDates(showDate))
+    $effect(() => getDates(showDate));
 
     function endOfDay(date: Date): Date {
         return new Date(date.getTime() + 24 * 60 * 60 * 1000 - 1);
     }
 
     function getDates(start: Date) {
+        console.log("Getting dates for start date: ", start);
         const resp = getMonthCalendar(start);
         calendarState.monthTitle = getTitleText(resp.year, resp.month, translatedLocale);
         dates = resp.dates;
@@ -98,7 +95,7 @@
                         class:today={typeof day === "string" ? false : isSameDay(today, day)}
                         class="block daily-date-block pointer">
                         {#if dayTemplate}
-                            {@render dayTemplate(day) }
+                            {@render dayTemplate(day)}
                         {:else}
                             {day.getDate()}
                         {/if}

frontend/app/src/components/calendar/calendarState.svelte.ts

@@ -1,13 +1,54 @@
 export type DateRange = { date: Date; range: [Date, Date] };
-let monthTitle = $state<string>("");
-const selectedMonth = $state<number>(0);
-const selectedRange = $state<DateRange>({
+
+let monthTitle = $state("");
+let selectedMonth = $state(0);
+let selectedRange = $state<DateRange>({
     date: new Date(),
     range: [new Date(), new Date()],
 });
 
-export const calendarState = {
-    monthTitle,
-    selectedMonth,
-    selectedRange,
-};
+class CalendarState {
+    get monthTitle() {
+        return monthTitle;
+    }
+    set monthTitle(value: string) {
+        monthTitle = value;
+    }
+    get selectedMonth() {
+        return selectedMonth;
+    }
+    set selectedMonth(value: number) {
+        selectedMonth = value;
+    }
+
+    get selectedRange() {
+        return selectedRange;
+    }
+    set selectedRange(value: DateRange) {
+        selectedRange = value;
+    }
+}
+
+// This *would* work and in much less verbose. But something converts the code
+// and puts the $state initialisation in the constructor which is not allowed.
+// To improve this I need to discover what is causing that particular pre-processing ...
+// class CalendarState {
+//     monthTitle = $state("");
+//     selectedMonth = $state(0);
+//     selectedRange = $state<DateRange>({
+//         date: new Date(),
+//         range: [new Date(), new Date()],
+//     });
+// }
+
+// This also works for reference but it doesn't support derived state
+// export const calendarState = $state({
+//     monthTitle: "",
+//     selectedMonth: 0,
+//     selectedRange: {
+//         date: new Date(),
+//         range: [new Date(), new Date()],
+//     },
+// });
+
+export const calendarState = new CalendarState();

frontend/app/src/components/home/profile/ChitEvents.svelte

@@ -14,7 +14,7 @@
     import { chitPopup, hideChitIcon, utcMode } from "../../../stores/settings";
     import Translatable from "../../Translatable.svelte";
     import { menuCloser } from "../../../actions/closeMenu";
-    import { calendarState, type DateRange } from "../../calendar/calendarState.svelte.ts";
+    import { calendarState, type DateRange } from "../../calendar/calendarState.svelte";
     import Calendar from "../../calendar/Calendar.svelte";
 
     const client = getContext<OpenChat>("client");

frontend/app/tsconfig.json

@@ -2,8 +2,7 @@
     "extends": "../tsconfig",
     "compilerOptions": {
         "isolatedModules": true,
-        "outDir": "build",
-        "allowImportingTsExtensions": true
+        "outDir": "build"
     },
     "include": ["./src/**/*"]
 }

frontend/tsconfig.json

@@ -18,6 +18,7 @@
         "strict": true,
         "target": "es2020",
         "types": ["jest", "node", "svelte"],
-        "verbatimModuleSyntax": true
+        "verbatimModuleSyntax": true,
+        "useDefineForClassFields": false
     }
 }