implement auto reconnect

src/ViewModel/Pages/boardViewModel.ts

@@ -1,8 +1,8 @@
 import * as React from "bloatless-react";
 
 import BoardsAndTasksModel, {
-  BoardInfoFileContent,
-  TaskFileContent,
+    BoardInfoFileContent,
+    TaskFileContent,
 } from "../../Model/Files/boardsAndTasksModel";
 
 import ChatViewModel from "../Chat/chatViewModel";
@@ -15,293 +15,299 @@ import TaskPageViewModel from "./taskPageViewModel";
 import TaskViewModel from "./taskViewModel";
 
 export default class BoardViewModel extends TaskContainingPageViewModel {
-  storageModel: StorageModel;
-  boardsAndTasksModel: BoardsAndTasksModel;
+    storageModel: StorageModel;
+    boardsAndTasksModel: BoardsAndTasksModel;
 
-  taskPageViewModel: TaskPageViewModel;
+    taskPageViewModel: TaskPageViewModel;
 
-  // data
-  boardInfo: BoardInfoFileContent;
+    // data
+    boardInfo: BoardInfoFileContent;
 
-  // state
-  name: React.State<string> = new React.State("");
-  color: React.State<Color> = new React.State<any>(Color.Standard);
+    // state
+    name: React.State<string> = new React.State("");
+    color: React.State<Color> = new React.State<any>(Color.Standard);
 
-  index: React.State<number> = new React.State(0);
+    index: React.State<number> = new React.State(0);
 
-  selectedPage: React.State<BoardPageType> = new React.State<any>(
-    BoardPageType.List
-  );
-
-  isSelected: React.State<boolean>;
-  isPresentingSettingsModal: React.State<boolean> = new React.State(false);
-  isPresentingFilterModal: React.State<boolean> = new React.State(false);
-
-  searchViewModel: SearchViewModel<TaskViewModel>;
-  filteredTaskViewModels: React.ListState<TaskViewModel> =
-    new React.ListState();
-
-  // paths
-  getBasePath = (): string[] => {
-    return [...this.taskPageViewModel.getBoardViewPath(this.boardInfo.fileId)];
-  };
-
-  getLastUsedBoardPath = (): string[] => {
-    return [...this.getBasePath(), BoardViewModelSubPath.LastUsedView];
-  };
-
-  getPreviousSearchesPath = (): string[] => {
-    return [...this.getBasePath(), BoardViewModelSubPath.PreviousSearches];
-  };
-
-  getLastSearchPath = (): string[] => {
-    return [...this.getBasePath(), BoardViewModelSubPath.LastSearch];
-  };
-
-  // settings
-  saveSettings = (): void => {
-    const newBoardInfoFileContent: BoardInfoFileContent =
-      BoardsAndTasksModel.createBoardInfoFileContent(
-        this.boardInfo.fileId,
-        this.name.value,
-        this.color.value
-      );
-    this.taskPageViewModel.updateBoard(newBoardInfoFileContent);
-  };
-
-  applyColor = (): void => {
-    this.taskPageViewModel.chatViewModel.setDisplayedColor(this.color.value);
-  };
-
-  deleteBoard = (): void => {
-    this.taskPageViewModel.deleteBoard(this.boardInfo);
-    this.chatViewModel.taskBoardSuggestions.remove(this.boardInfo.fileId);
-    this.close();
-  };
-
-  // methods
-  createTask = (): void => {
-    this.createTaskFromBoardId(this.boardInfo.fileId);
-  };
-
-  handleDropWithinBoard = (category?: string, status?: string): void => {
-    const draggedObject: any = this.coreViewModel.draggedObject.value;
-    if (draggedObject instanceof TaskViewModel == false) return;
-    draggedObject.setCategoryAndStatus(category, status);
-  };
-
-  handleDropBetweenBoards = (): void => {
-    const draggedObject: any = this.coreViewModel.draggedObject.value;
-    if (draggedObject instanceof TaskViewModel == false) return;
-    draggedObject.setBoardId(this.boardInfo.fileId);
-  };
-
-  // storage
-  storeLastUsedView = (): void => {
-    const path: string[] = this.getLastUsedBoardPath();
-    const lastUsedView: string = this.selectedPage.value;
-    this.storageModel.write(path, lastUsedView);
-  };
-
-  restoreLastUsedView = (): void => {
-    const path: string[] = this.getLastUsedBoardPath();
-    const lastUsedView: string | null = this.storageModel.read(path);
-    if (lastUsedView == null) return;
-
-    this.selectedPage.value = lastUsedView as BoardPageType;
-  };
-
-  handleNewSearch = (searchTerm: string): void => {
-    const suggestionPath: string[] = [
-      ...this.getPreviousSearchesPath(),
-      searchTerm,
-    ];
-    this.storageModel.write(suggestionPath, "");
-    if (!this.coreViewModel.boardSearchSuggestions.value.has(searchTerm)) {
-      this.coreViewModel.boardSearchSuggestions.add(searchTerm);
-    }
-
-    const lastSearchPath: string[] = this.getLastSearchPath();
-    this.storageModel.write(lastSearchPath, searchTerm);
-  };
-
-  // view
-  showTask = (taskFileContent: TaskFileContent): void => {
-    if (taskFileContent.boardId != this.boardInfo.fileId) {
-      // remove task that was moved to different board
-      this.boardsAndTasksModel.deleteTaskReference(
-        this.boardInfo.fileId,
-        taskFileContent.fileId
-      );
-      this.removeTaskFromView(taskFileContent);
-      return;
-    }
-
-    const taskViewModel: TaskViewModel = new TaskViewModel(
-      this.coreViewModel,
-      this.chatViewModel,
-      this.boardsAndTasksModel,
-      this,
-      taskFileContent
+    selectedPage: React.State<BoardPageType> = new React.State<any>(
+        BoardPageType.List,
     );
-    this.taskViewModels.set(taskFileContent.fileId, taskViewModel);
-  };
 
-  removeTaskFromView = (taskFileContent: TaskFileContent): void => {
-    this.taskViewModels.remove(taskFileContent.fileId);
-    this.updateIndex();
-  };
+    isSelected: React.State<boolean>;
+    isPresentingSettingsModal: React.State<boolean> = new React.State(false);
+    isPresentingFilterModal: React.State<boolean> = new React.State(false);
 
-  select = (): void => {
-    this.taskPageViewModel.selectBoard(this);
-  };
+    searchViewModel: SearchViewModel<TaskViewModel>;
+    filteredTaskViewModels: React.ListState<TaskViewModel> =
+        new React.ListState();
 
-  close = (): void => {
-    this.taskPageViewModel.closeBoard();
-    this.taskViewModels.clear();
-  };
+    // paths
+    getBasePath = (): string[] => {
+        return [
+            ...this.taskPageViewModel.getBoardViewPath(this.boardInfo.fileId),
+        ];
+    };
 
-  showSettings = (): void => {
-    this.isPresentingSettingsModal.value = true;
-  };
+    getLastUsedBoardPath = (): string[] => {
+        return [...this.getBasePath(), BoardViewModelSubPath.LastUsedView];
+    };
 
-  hideSettings = (): void => {
-    this.saveSettings();
-    this.isPresentingSettingsModal.value = false;
-  };
+    getPreviousSearchesPath = (): string[] => {
+        return [...this.getBasePath(), BoardViewModelSubPath.PreviousSearches];
+    };
 
-  showFilterModal = (): void => {
-    this.isPresentingFilterModal.value = true;
-  };
+    getLastSearchPath = (): string[] => {
+        return [...this.getBasePath(), BoardViewModelSubPath.LastSearch];
+    };
 
-  hideFilterModal = (): void => {
-    this.isPresentingFilterModal.value = false;
-  };
+    // settings
+    saveSettings = (): void => {
+        const newBoardInfoFileContent: BoardInfoFileContent =
+            BoardsAndTasksModel.createBoardInfoFileContent(
+                this.boardInfo.fileId,
+                this.name.value,
+                this.color.value,
+            );
+        this.taskPageViewModel.updateBoard(newBoardInfoFileContent);
+    };
 
-  updateIndex = (): void => {
-    const index: number =
-      this.taskPageViewModel.boardIndexManager.getIndex(this);
-    this.index.value = index;
-  };
+    applyColor = (): void => {
+        this.taskPageViewModel.chatViewModel.setDisplayedColor(
+            this.color.value,
+        );
+    };
 
-  // load
-  loadListRelevantData = (): void => {
-    this.name.value = this.boardInfo.name;
-    this.color.value = this.boardInfo.color;
-  };
+    deleteBoard = (): void => {
+        this.taskPageViewModel.deleteBoard(this.boardInfo);
+        this.chatViewModel.taskBoardSuggestions.remove(this.boardInfo.fileId);
+        this.close();
+    };
 
-  loadTasks = (): void => {
-    const taskIds: string[] = this.boardsAndTasksModel.listTaskIds(
-      this.boardInfo.fileId
-    );
-    for (const taskId of taskIds) {
-      if (this.taskViewModels.value.has(taskId)) return;
+    // methods
+    createTask = (): void => {
+        this.createTaskFromBoardId(this.boardInfo.fileId);
+    };
 
-      const taskFileContent: TaskFileContent | null =
-        this.boardsAndTasksModel.getLatestTaskFileContent(taskId);
-      if (taskFileContent == null) continue;
+    handleDropWithinBoard = (category?: string, status?: string): void => {
+        const draggedObject: any = this.coreViewModel.draggedObject.value;
+        if (draggedObject instanceof TaskViewModel == false) return;
+        draggedObject.setCategoryAndStatus(category, status);
+    };
 
-      const taskViewModel: TaskViewModel = new TaskViewModel(
-        this.coreViewModel,
-        this.chatViewModel,
-        this.boardsAndTasksModel,
-        this,
-        taskFileContent
-      );
-      this.taskViewModels.set(taskFileContent.fileId, taskViewModel);
-    }
+    handleDropBetweenBoards = (): void => {
+        const draggedObject: any = this.coreViewModel.draggedObject.value;
+        if (draggedObject instanceof TaskViewModel == false) return;
+        draggedObject.setBoardId(this.boardInfo.fileId);
+    };
 
-    this.updateTaskIndices();
-  };
+    // storage
+    storeLastUsedView = (): void => {
+        const path: string[] = this.getLastUsedBoardPath();
+        const lastUsedView: string = this.selectedPage.value;
+        this.storageModel.write(path, lastUsedView);
+    };
 
-  loadSearchSuggestions = (): void => {
-    const dirPath: string[] = this.getPreviousSearchesPath();
-    const searches: string[] = this.storageModel.list(dirPath);
-    this.coreViewModel.boardSearchSuggestions.add(...searches);
-  };
+    restoreLastUsedView = (): void => {
+        const path: string[] = this.getLastUsedBoardPath();
+        const lastUsedView: string | null = this.storageModel.read(path);
+        if (lastUsedView == null) return;
 
-  restoreSearch = (): void => {
-    const lastSearchPath: string[] = this.getLastSearchPath();
-    const lastSearch: string | null = this.storageModel.read(lastSearchPath);
-    if (lastSearch != null) {
-      this.searchViewModel.search(lastSearch);
-    }
-  };
+        this.selectedPage.value = lastUsedView as BoardPageType;
+    };
 
-  loadData = (): void => {
-    this.restoreLastUsedView();
-    this.loadTasks();
-    this.loadSearchSuggestions();
-  };
+    handleNewSearch = (searchTerm: string): void => {
+        const suggestionPath: string[] = [
+            ...this.getPreviousSearchesPath(),
+            searchTerm,
+        ];
+        this.storageModel.write(suggestionPath, "");
+        if (!this.coreViewModel.boardSearchSuggestions.value.has(searchTerm)) {
+            this.coreViewModel.boardSearchSuggestions.add(searchTerm);
+        }
 
-  // init
-  constructor(
-    public coreViewModel: CoreViewModel,
-    public chatViewModel: ChatViewModel,
-    storageModel: StorageModel,
-    boardsAndTasksModel: BoardsAndTasksModel,
-    taskPageViewModel: TaskPageViewModel,
-    boardInfo: BoardInfoFileContent
-  ) {
-    super(coreViewModel, chatViewModel, boardsAndTasksModel);
+        const lastSearchPath: string[] = this.getLastSearchPath();
+        this.storageModel.write(lastSearchPath, searchTerm);
+    };
 
-    // set
-    this.storageModel = storageModel;
-    this.boardsAndTasksModel = boardsAndTasksModel;
-    this.taskPageViewModel = taskPageViewModel;
-    this.boardInfo = boardInfo;
+    // view
+    showTask = (taskFileContent: TaskFileContent): void => {
+        if (taskFileContent.boardId != this.boardInfo.fileId) {
+            // remove task that was moved to different board
+            this.boardsAndTasksModel.deleteTaskReference(
+                this.boardInfo.fileId,
+                taskFileContent.fileId,
+            );
+            this.removeTaskFromView(taskFileContent);
+            return;
+        }
+
+        const taskViewModel: TaskViewModel = new TaskViewModel(
+            this.coreViewModel,
+            this.chatViewModel,
+            this.boardsAndTasksModel,
+            this,
+            taskFileContent,
+        );
+        this.taskViewModels.set(taskFileContent.fileId, taskViewModel);
+    };
+
+    removeTaskFromView = (taskFileContent: TaskFileContent): void => {
+        this.taskViewModels.remove(taskFileContent.fileId);
+        this.updateIndex();
+    };
+
+    select = (): void => {
+        this.taskPageViewModel.selectBoard(this);
+    };
+
+    close = (): void => {
+        this.taskPageViewModel.closeBoard();
+        this.taskViewModels.clear();
+    };
+
+    showSettings = (): void => {
+        this.isPresentingSettingsModal.value = true;
+    };
+
+    hideSettings = (): void => {
+        this.saveSettings();
+        this.isPresentingSettingsModal.value = false;
+    };
+
+    showFilterModal = (): void => {
+        this.isPresentingFilterModal.value = true;
+    };
+
+    hideFilterModal = (): void => {
+        this.isPresentingFilterModal.value = false;
+    };
+
+    updateIndex = (): void => {
+        const index: number =
+            this.taskPageViewModel.boardIndexManager.getIndex(this);
+        this.index.value = index;
+    };
 
     // load
-    this.loadListRelevantData();
+    loadListRelevantData = (): void => {
+        this.name.value = this.boardInfo.name;
+        this.color.value = this.boardInfo.color;
+    };
 
-    // subscriptions
-    this.isSelected = React.createProxyState(
-      [this.taskPageViewModel.selectedBoardId],
-      () =>
-        this.taskPageViewModel.selectedBoardId.value == this.boardInfo.fileId
-    );
+    loadTasks = (): void => {
+        const taskIds: string[] = this.boardsAndTasksModel.listTaskIds(
+            this.boardInfo.fileId,
+        );
+        for (const taskId of taskIds) {
+            if (this.taskViewModels.value.has(taskId)) return;
 
-    this.color.subscribe(() => {
-      if (this.isSelected.value == false) return;
-      this.applyColor();
-    });
+            const taskFileContent: TaskFileContent | null =
+                this.boardsAndTasksModel.getLatestTaskFileContent(taskId);
+            if (taskFileContent == null) continue;
 
-    this.selectedPage.subscribeSilent(() => {
-      this.storeLastUsedView();
-    });
+            const taskViewModel: TaskViewModel = new TaskViewModel(
+                this.coreViewModel,
+                this.chatViewModel,
+                this.boardsAndTasksModel,
+                this,
+                taskFileContent,
+            );
+            this.taskViewModels.set(taskFileContent.fileId, taskViewModel);
+        }
 
-    // handlers
-    boardsAndTasksModel.taskHandlerManager.addHandler(
-      (taskFileContent: TaskFileContent) => {
-        if (taskFileContent.boardId != this.boardInfo.fileId) return;
-        this.showTask(taskFileContent);
         this.updateTaskIndices();
-      }
-    );
+    };
 
-    // search
-    this.searchViewModel = new SearchViewModel(
-      this.taskViewModels,
-      this.filteredTaskViewModels,
-      TaskViewModel.getStringsForFilter,
-      this.coreViewModel.boardSearchSuggestions
-    );
-    this.searchViewModel.appliedQuery.subscribeSilent((newQuery) => {
-      this.handleNewSearch(newQuery);
-    });
-    this.restoreSearch();
-  }
+    loadSearchSuggestions = (): void => {
+        const dirPath: string[] = this.getPreviousSearchesPath();
+        const searches: string[] = this.storageModel.list(dirPath);
+        this.coreViewModel.boardSearchSuggestions.add(...searches);
+    };
+
+    restoreSearch = (): void => {
+        const lastSearchPath: string[] = this.getLastSearchPath();
+        const lastSearch: string | null =
+            this.storageModel.read(lastSearchPath);
+        if (lastSearch != null) {
+            this.searchViewModel.search(lastSearch);
+        }
+    };
+
+    loadData = (): void => {
+        this.restoreLastUsedView();
+        this.loadTasks();
+        this.loadSearchSuggestions();
+    };
+
+    // init
+    constructor(
+        public coreViewModel: CoreViewModel,
+        public chatViewModel: ChatViewModel,
+        storageModel: StorageModel,
+        boardsAndTasksModel: BoardsAndTasksModel,
+        taskPageViewModel: TaskPageViewModel,
+        boardInfo: BoardInfoFileContent,
+    ) {
+        super(coreViewModel, chatViewModel, boardsAndTasksModel);
+
+        // set
+        this.storageModel = storageModel;
+        this.boardsAndTasksModel = boardsAndTasksModel;
+        this.taskPageViewModel = taskPageViewModel;
+        this.boardInfo = boardInfo;
+
+        // load
+        this.loadListRelevantData();
+
+        // subscriptions
+        this.isSelected = React.createProxyState(
+            [this.taskPageViewModel.selectedBoardId],
+            () =>
+                this.taskPageViewModel.selectedBoardId.value ==
+                this.boardInfo.fileId,
+        );
+
+        this.color.subscribe(() => {
+            if (this.isSelected.value == false) return;
+            this.applyColor();
+        });
+
+        this.selectedPage.subscribeSilent(() => {
+            this.storeLastUsedView();
+        });
+
+        // handlers
+        boardsAndTasksModel.taskHandlerManager.addHandler(
+            (taskFileContent: TaskFileContent) => {
+                if (taskFileContent.boardId != this.boardInfo.fileId) return;
+                this.showTask(taskFileContent);
+                this.updateTaskIndices();
+            },
+        );
+
+        // search
+        this.searchViewModel = new SearchViewModel(
+            this.taskViewModels,
+            this.filteredTaskViewModels,
+            TaskViewModel.getStringsForFilter,
+            this.coreViewModel.boardSearchSuggestions,
+        );
+        this.searchViewModel.appliedQuery.subscribeSilent((newQuery) => {
+            this.handleNewSearch(newQuery);
+        });
+        this.restoreSearch();
+    }
 }
 
 export enum BoardViewModelSubPath {
-  LastUsedView = "last-used-view",
-  PreviousSearches = "previous-searches",
-  LastSearch = "last-search",
+    LastUsedView = "last-used-view",
+    PreviousSearches = "previous-searches",
+    LastSearch = "last-search",
 }
 
 // types
 export enum BoardPageType {
-  List = "list",
-  Kanban = "kanban",
-  StatusGrid = "status-grid",
+    List = "list",
+    Kanban = "kanban",
+    StatusGrid = "status-grid",
 }