move translations to CoreVM, move models to CoreVM for sentralization

src/View/Components/chatMessage.tsx

@@ -3,10 +3,13 @@ import * as React from "bloatless-react";
 import { ChatMessageInfoModal } from "../Modals/chatMessageInfoModal";
 import { ChatMessageStatuses } from "../../Model/Chat/chatModel";
 import ChatMessageViewModel from "../../ViewModel/Chat/chatMessageViewModel";
-import { translations } from "../translations";
 import { MessageReactionButtonRow } from "./messageReactionButtonRow";
+import CoreViewModel from "../../ViewModel/Global/coreViewModel";
 
-export function ChatMessage(chatMessageViewModel: ChatMessageViewModel) {
+export function ChatMessage(
+    coreViewModel: CoreViewModel,
+    chatMessageViewModel: ChatMessageViewModel,
+) {
     const statusIcon = React.createProxyState(
         [chatMessageViewModel.status],
         () => {
@@ -50,7 +53,7 @@ export function ChatMessage(chatMessageViewModel: ChatMessageViewModel) {
                     <button
                         on:click={chatMessageViewModel.showInfoModal}
                         aria-label={
-                            translations.chatPage.message
+                            coreViewModel.translations.chatPage.message
                                 .showMessageInfoButtonAudioLabel
                         }
                     >
@@ -58,14 +61,8 @@ export function ChatMessage(chatMessageViewModel: ChatMessageViewModel) {
                     </button>
                 </div>
             </div>
-            {MessageReactionButtonRow(chatMessageViewModel)}
-            {ChatMessageInfoModal(chatMessageViewModel)}
+            {MessageReactionButtonRow(coreViewModel, chatMessageViewModel)}
+            {ChatMessageInfoModal(coreViewModel, chatMessageViewModel)}
         </div>
     );
 }
-
-export const ChatMessageViewModelToView: React.StateItemConverter<
-    ChatMessageViewModel
-> = (chatMessageViewModel: ChatMessageViewModel) => {
-    return ChatMessage(chatMessageViewModel);
-};

src/View/Components/dangerousActionButton.tsx

@@ -1,8 +1,8 @@
 import * as React from "bloatless-react";
-
-import { translations } from "../translations";
+import CoreViewModel from "../../ViewModel/Global/coreViewModel";
 
 export function DangerousActionButton(
+    coreViewModel: CoreViewModel,
     label: string,
     icon: string,
     action: () => void,
@@ -23,7 +23,7 @@ export function DangerousActionButton(
     return (
         <div class="flex-row">
             <button class="flex" on:click={abort} toggle:hidden={cannotConfirm}>
-                {translations.general.abortButton}
+                {coreViewModel.translations.general.abortButton}
                 <span class="icon">undo</span>
             </button>
             <button
@@ -39,7 +39,7 @@ export function DangerousActionButton(
                 on:click={action}
                 toggle:hidden={cannotConfirm}
             >
-                {translations.general.confirmButton}
+                {coreViewModel.translations.general.confirmButton}
                 <span class="icon">warning</span>
             </button>
         </div>

src/View/Components/deletableListItem.tsx

@@ -1,8 +1,8 @@
 import * as React from "bloatless-react";
-
-import { translations } from "../translations";
+import CoreViewModel from "../../ViewModel/Global/coreViewModel";
 
 export function DeletableListItem(
+    coreViewModel: CoreViewModel,
     text: string,
     primaryButton: HTMLElement,
     ondelete: () => void,
@@ -16,7 +16,10 @@ export function DeletableListItem(
 
                 <button
                     class="danger"
-                    aria-label={translations.general.deleteItemButtonAudioLabel}
+                    aria-label={
+                        coreViewModel.translations.general
+                            .deleteItemButtonAudioLabel
+                    }
                     on:click={ondelete}
                 >
                     <span class="icon">delete</span>

src/View/Components/directoryItemList.tsx

@@ -26,7 +26,8 @@ export function DirectoryItemList(
     function loadItems() {
         items.clear();
 
-        const directoryItems = storageViewModel.storageModel.list(path);
+        const directoryItems =
+            storageViewModel.coreViewModel.storageModel.list(path);
 
         for (const directoryItem of directoryItems) {
             const itemPath = [...path, directoryItem];

src/View/Components/messageReactionButton.tsx

@@ -4,9 +4,10 @@ import {
     ReactionSymbols,
 } from "../../Model/Chat/chatModel";
 import ChatMessageViewModel from "../../ViewModel/Chat/chatMessageViewModel";
-import { translations } from "../translations";
+import CoreViewModel from "../../ViewModel/Global/coreViewModel";
 
 export function MessageReactionButton(
+    coreViewModel: CoreViewModel,
     chatMessageViewModel: ChatMessageViewModel,
     content: ReactionSymbols,
 ) {
@@ -31,37 +32,44 @@ export function MessageReactionButton(
 
     switch (content) {
         case ReactionSymbols.ThumbsUp: {
-            audioLabel = translations.chatPage.message.thumbsUpReaction;
+            audioLabel =
+                coreViewModel.translations.chatPage.message.thumbsUpReaction;
             count = chatMessageViewModel.reactionsThumbsUpCount;
             reactionState = chatMessageViewModel.reactionsThumbsUp;
             break;
         }
         case ReactionSymbols.Check: {
-            audioLabel = translations.chatPage.message.checkReaction;
+            audioLabel =
+                coreViewModel.translations.chatPage.message.checkReaction;
             count = chatMessageViewModel.reactionsCheckCount;
             reactionState = chatMessageViewModel.reactionsCheck;
             break;
         }
         case ReactionSymbols.Stop: {
-            audioLabel = translations.chatPage.message.stopReaction;
+            audioLabel =
+                coreViewModel.translations.chatPage.message.stopReaction;
             count = chatMessageViewModel.reactionsStopCount;
             reactionState = chatMessageViewModel.reactionsStop;
             break;
         }
         case ReactionSymbols.Attention: {
-            audioLabel = translations.chatPage.message.attentionReaction;
+            audioLabel =
+                coreViewModel.translations.chatPage.message.attentionReaction;
             count = chatMessageViewModel.reactionsAttentionCount;
             reactionState = chatMessageViewModel.reactionsAttention;
             break;
         }
         case ReactionSymbols.DoubleAttention: {
-            audioLabel = translations.chatPage.message.doubleAttentionReaction;
+            audioLabel =
+                coreViewModel.translations.chatPage.message
+                    .doubleAttentionReaction;
             count = chatMessageViewModel.reactionsDoubleAttentionCount;
             reactionState = chatMessageViewModel.reactionsDoubleAttention;
             break;
         }
         case ReactionSymbols.Question: {
-            audioLabel = translations.chatPage.message.questionReaction;
+            audioLabel =
+                coreViewModel.translations.chatPage.message.questionReaction;
             count = chatMessageViewModel.reactionsQuestionCount;
             reactionState = chatMessageViewModel.reactionsQuestion;
             break;

src/View/Components/messageReactionButtonRow.tsx

@@ -1,29 +1,42 @@
 import * as React from "bloatless-react";
 import { ReactionSymbols } from "../../Model/Chat/chatModel";
 import ChatMessageViewModel from "../../ViewModel/Chat/chatMessageViewModel";
-import { translations } from "../translations";
 import { MessageReactionButton } from "./messageReactionButton";
+import CoreViewModel from "../../ViewModel/Global/coreViewModel";
 
 export function MessageReactionButtonRow(
+    coreViewModel: CoreViewModel,
     chatMessageViewModel: ChatMessageViewModel,
 ) {
     return (
         <div class="grid gap width-100 message-reaction-row">
             {MessageReactionButton(
+                coreViewModel,
                 chatMessageViewModel,
                 ReactionSymbols.ThumbsUp,
             )}
-            {MessageReactionButton(chatMessageViewModel, ReactionSymbols.Check)}
-            {MessageReactionButton(chatMessageViewModel, ReactionSymbols.Stop)}
             {MessageReactionButton(
+                coreViewModel,
+                chatMessageViewModel,
+                ReactionSymbols.Check,
+            )}
+            {MessageReactionButton(
+                coreViewModel,
+                chatMessageViewModel,
+                ReactionSymbols.Stop,
+            )}
+            {MessageReactionButton(
+                coreViewModel,
                 chatMessageViewModel,
                 ReactionSymbols.Attention,
             )}
             {MessageReactionButton(
+                coreViewModel,
                 chatMessageViewModel,
                 ReactionSymbols.DoubleAttention,
             )}
             {MessageReactionButton(
+                coreViewModel,
                 chatMessageViewModel,
                 ReactionSymbols.Question,
             )}

src/View/Components/monthGrid.tsx

@@ -3,11 +3,12 @@ import "./monthGrid.css";
 import * as React from "bloatless-react";
 import { MonthGrid } from "../../Model/Files/calendarModel";
 import TaskViewModel from "../../ViewModel/Pages/taskViewModel";
-import { translations } from "../translations";
 import { allowDrop } from "../utility";
 import { localeCompare } from "../../Model/Utility/utility";
+import CoreViewModel from "../../ViewModel/Global/coreViewModel";
 
 export function MonthGrid<T>(
+    coreViewModel: CoreViewModel,
     monthGrid: MonthGrid<React.MapState<T>>,
     selectedDate: React.State<number>,
     handleDrop: (date: string) => void,
@@ -17,7 +18,11 @@ export function MonthGrid<T>(
     while (dayLabels.length < 7) {
         dayLabels.push(
             <span class="secondary">
-                {translations.regional.weekdays.abbreviated[currentWeekday]}
+                {
+                    coreViewModel.translations.regional.weekdays.abbreviated[
+                        currentWeekday
+                    ]
+                }
             </span>,
         );
         currentWeekday++;