2024-07-23 00:57:40 +02:00
|
|
|
import * as React from "bloatless-react";
|
|
|
|
|
|
2024-07-24 17:28:49 +02:00
|
|
|
import BoardsAndTasksModel, {
|
2026-04-01 08:29:39 +00:00
|
|
|
BoardInfoFileContent,
|
|
|
|
|
TaskFileContent,
|
2024-07-24 17:28:49 +02:00
|
|
|
} from "../../Model/Files/boardsAndTasksModel";
|
2024-07-23 13:19:08 +02:00
|
|
|
|
2026-04-08 14:02:12 +00:00
|
|
|
import ChatViewModel, { ChatPageTypes } from "../Chat/chatViewModel";
|
|
|
|
|
import { Colors } from "../../colors";
|
2024-07-25 16:02:49 +02:00
|
|
|
import CoreViewModel from "../Global/coreViewModel";
|
2024-07-27 03:41:47 +02:00
|
|
|
import SearchViewModel from "../Utility/searchViewModel";
|
2024-07-23 21:33:22 +02:00
|
|
|
import StorageModel from "../../Model/Global/storageModel";
|
2024-07-26 06:20:16 +02:00
|
|
|
import TaskContainingPageViewModel from "./taskContainingPageViewModel";
|
2024-07-23 00:57:40 +02:00
|
|
|
import TaskPageViewModel from "./taskPageViewModel";
|
2024-07-24 01:19:44 +02:00
|
|
|
import TaskViewModel from "./taskViewModel";
|
2026-04-12 19:20:37 +00:00
|
|
|
import { CommonKeys } from "../../View/keystrokes";
|
2024-07-23 00:57:40 +02:00
|
|
|
|
2024-07-26 06:20:16 +02:00
|
|
|
export default class BoardViewModel extends TaskContainingPageViewModel {
|
2026-04-01 08:29:39 +00:00
|
|
|
// state
|
|
|
|
|
name: React.State<string> = new React.State("");
|
2026-04-08 14:02:12 +00:00
|
|
|
color: React.State<Colors> = new React.State<any>(Colors.Standard);
|
2024-07-23 00:57:40 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
index: React.State<number> = new React.State(0);
|
2024-07-23 02:40:11 +02:00
|
|
|
|
2026-04-08 14:02:12 +00:00
|
|
|
selectedPage: React.State<BoardPageTypes> = new React.State<any>(
|
|
|
|
|
BoardPageTypes.List,
|
2024-07-23 02:40:11 +02:00
|
|
|
);
|
2024-07-23 13:48:17 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
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();
|
2026-04-12 12:00:30 +00:00
|
|
|
isFilterActive: React.State<boolean>;
|
2026-04-01 08:29:39 +00:00
|
|
|
|
|
|
|
|
// paths
|
|
|
|
|
getBasePath = (): string[] => {
|
|
|
|
|
return [
|
|
|
|
|
...this.taskPageViewModel.getBoardViewPath(this.boardInfo.fileId),
|
|
|
|
|
];
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
getLastUsedBoardPath = (): string[] => {
|
2026-04-08 14:02:12 +00:00
|
|
|
return [...this.getBasePath(), BoardViewModelSubPaths.LastUsedView];
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
getPreviousSearchesPath = (): string[] => {
|
2026-04-08 14:02:12 +00:00
|
|
|
return [...this.getBasePath(), BoardViewModelSubPaths.PreviousSearches];
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
getLastSearchPath = (): string[] => {
|
2026-04-08 14:02:12 +00:00
|
|
|
return [...this.getBasePath(), BoardViewModelSubPaths.LastSearch];
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// settings
|
|
|
|
|
saveSettings = (): void => {
|
|
|
|
|
const newBoardInfoFileContent: BoardInfoFileContent =
|
|
|
|
|
BoardsAndTasksModel.createBoardInfoFileContent(
|
|
|
|
|
this.boardInfo.fileId,
|
|
|
|
|
this.name.value,
|
|
|
|
|
this.color.value,
|
|
|
|
|
);
|
|
|
|
|
this.taskPageViewModel.updateBoard(newBoardInfoFileContent);
|
2026-04-13 11:23:17 +00:00
|
|
|
|
|
|
|
|
this.taskPageViewModel.selectBoard(this);
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
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;
|
2026-04-09 16:48:22 +00:00
|
|
|
this.coreViewModel.storageModel.write(path, lastUsedView);
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
restoreLastUsedView = (): void => {
|
|
|
|
|
const path: string[] = this.getLastUsedBoardPath();
|
2026-04-09 16:48:22 +00:00
|
|
|
const lastUsedView: string | null =
|
|
|
|
|
this.coreViewModel.storageModel.read(path);
|
2026-04-01 08:29:39 +00:00
|
|
|
if (lastUsedView == null) return;
|
|
|
|
|
|
2026-04-08 14:02:12 +00:00
|
|
|
this.selectedPage.value = lastUsedView as BoardPageTypes;
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
handleNewSearch = (searchTerm: string): void => {
|
|
|
|
|
const suggestionPath: string[] = [
|
|
|
|
|
...this.getPreviousSearchesPath(),
|
|
|
|
|
searchTerm,
|
|
|
|
|
];
|
2026-04-09 16:48:22 +00:00
|
|
|
this.coreViewModel.storageModel.write(suggestionPath, "");
|
2026-04-06 15:50:13 +00:00
|
|
|
if (
|
|
|
|
|
!this.coreViewModel.boardFilterStringSuggestions.value.has(
|
|
|
|
|
searchTerm,
|
|
|
|
|
)
|
|
|
|
|
) {
|
|
|
|
|
this.coreViewModel.boardFilterStringSuggestions.add(searchTerm);
|
2026-04-01 08:29:39 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const lastSearchPath: string[] = this.getLastSearchPath();
|
2026-04-09 16:48:22 +00:00
|
|
|
this.coreViewModel.storageModel.write(lastSearchPath, searchTerm);
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// 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;
|
|
|
|
|
};
|
|
|
|
|
|
2026-04-12 19:20:37 +00:00
|
|
|
resetFilter = (): void => {
|
|
|
|
|
this.searchViewModel.search("");
|
|
|
|
|
};
|
|
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
updateIndex = (): void => {
|
|
|
|
|
const index: number =
|
|
|
|
|
this.taskPageViewModel.boardIndexManager.getIndex(this);
|
|
|
|
|
this.index.value = index;
|
|
|
|
|
};
|
2024-07-24 13:40:17 +02:00
|
|
|
|
2026-04-01 08:29:39 +00:00
|
|
|
// load
|
|
|
|
|
loadListRelevantData = (): void => {
|
|
|
|
|
this.name.value = this.boardInfo.name;
|
|
|
|
|
this.color.value = this.boardInfo.color;
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
loadTasks = (): void => {
|
|
|
|
|
const taskIds: string[] = this.boardsAndTasksModel.listTaskIds(
|
|
|
|
|
this.boardInfo.fileId,
|
|
|
|
|
);
|
|
|
|
|
for (const taskId of taskIds) {
|
|
|
|
|
if (this.taskViewModels.value.has(taskId)) return;
|
|
|
|
|
|
|
|
|
|
const taskFileContent: TaskFileContent | null =
|
|
|
|
|
this.boardsAndTasksModel.getLatestTaskFileContent(taskId);
|
|
|
|
|
if (taskFileContent == null) continue;
|
|
|
|
|
|
|
|
|
|
const taskViewModel: TaskViewModel = new TaskViewModel(
|
|
|
|
|
this.coreViewModel,
|
|
|
|
|
this.chatViewModel,
|
|
|
|
|
this.boardsAndTasksModel,
|
|
|
|
|
this,
|
|
|
|
|
taskFileContent,
|
|
|
|
|
);
|
|
|
|
|
this.taskViewModels.set(taskFileContent.fileId, taskViewModel);
|
|
|
|
|
}
|
2024-07-24 13:40:17 +02:00
|
|
|
|
2024-07-24 14:34:28 +02:00
|
|
|
this.updateTaskIndices();
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
loadSearchSuggestions = (): void => {
|
|
|
|
|
const dirPath: string[] = this.getPreviousSearchesPath();
|
2026-04-09 16:48:22 +00:00
|
|
|
const searches: string[] =
|
|
|
|
|
this.coreViewModel.storageModel.list(dirPath);
|
2026-04-06 15:50:13 +00:00
|
|
|
this.coreViewModel.boardFilterStringSuggestions.add(...searches);
|
2026-04-01 08:29:39 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
restoreSearch = (): void => {
|
|
|
|
|
const lastSearchPath: string[] = this.getLastSearchPath();
|
|
|
|
|
const lastSearch: string | null =
|
2026-04-09 16:48:22 +00:00
|
|
|
this.coreViewModel.storageModel.read(lastSearchPath);
|
2026-04-01 08:29:39 +00:00
|
|
|
if (lastSearch != null) {
|
|
|
|
|
this.searchViewModel.search(lastSearch);
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
loadData = (): void => {
|
|
|
|
|
this.restoreLastUsedView();
|
|
|
|
|
this.loadTasks();
|
|
|
|
|
this.loadSearchSuggestions();
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
// init
|
|
|
|
|
constructor(
|
2026-04-13 10:58:21 +00:00
|
|
|
public readonly coreViewModel: CoreViewModel,
|
|
|
|
|
public readonly chatViewModel: ChatViewModel,
|
|
|
|
|
public readonly boardsAndTasksModel: BoardsAndTasksModel,
|
|
|
|
|
public readonly taskPageViewModel: TaskPageViewModel,
|
|
|
|
|
public readonly boardInfo: BoardInfoFileContent,
|
2026-04-01 08:29:39 +00:00
|
|
|
) {
|
2026-04-13 19:45:52 +00:00
|
|
|
super(coreViewModel, chatViewModel, boardsAndTasksModel, "board");
|
2026-04-01 08:29:39 +00:00
|
|
|
|
|
|
|
|
// 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;
|
2026-04-08 20:31:25 +00:00
|
|
|
if (this.chatViewModel.selectedPage.value != ChatPageTypes.Tasks)
|
|
|
|
|
return;
|
2026-04-01 08:29:39 +00:00
|
|
|
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,
|
2026-04-06 15:50:13 +00:00
|
|
|
this.coreViewModel.boardFilterStringSuggestions,
|
2026-04-01 08:29:39 +00:00
|
|
|
);
|
|
|
|
|
this.searchViewModel.appliedQuery.subscribeSilent((newQuery) => {
|
|
|
|
|
this.handleNewSearch(newQuery);
|
|
|
|
|
});
|
|
|
|
|
this.restoreSearch();
|
2026-04-12 12:00:30 +00:00
|
|
|
|
|
|
|
|
this.isFilterActive = React.createProxyState(
|
|
|
|
|
[this.searchViewModel.appliedQuery],
|
|
|
|
|
() => this.searchViewModel.appliedQuery.value != "",
|
|
|
|
|
);
|
2026-04-12 19:20:37 +00:00
|
|
|
|
|
|
|
|
// keystrokes
|
|
|
|
|
this.registerKeyStroke(CommonKeys.Filter, this.showFilterModal);
|
|
|
|
|
this.registerKeyStroke(CommonKeys.Reset, this.resetFilter);
|
2026-04-13 11:23:17 +00:00
|
|
|
this.registerKeyStroke(CommonKeys.CloseOrCancel, this.hideFilterModal);
|
|
|
|
|
this.registerKeyStroke(CommonKeys.Settings, this.showSettings);
|
|
|
|
|
this.registerKeyStroke(CommonKeys.Apply, this.hideSettings);
|
2026-04-13 14:07:43 +00:00
|
|
|
this.registerKeyStroke(CommonKeys.Create, this.createTask);
|
2026-04-12 19:20:37 +00:00
|
|
|
|
|
|
|
|
this.taskPageViewModel.registerContext(this.boardInfo.fileId, this);
|
2026-04-01 08:29:39 +00:00
|
|
|
}
|
2024-07-23 00:57:40 +02:00
|
|
|
}
|
2024-07-23 15:41:03 +02:00
|
|
|
|
2026-04-08 14:02:12 +00:00
|
|
|
export enum BoardViewModelSubPaths {
|
2026-04-01 08:29:39 +00:00
|
|
|
LastUsedView = "last-used-view",
|
|
|
|
|
PreviousSearches = "previous-searches",
|
|
|
|
|
LastSearch = "last-search",
|
2024-07-23 21:33:22 +02:00
|
|
|
}
|
|
|
|
|
|
2024-07-23 15:41:03 +02:00
|
|
|
// types
|
2026-04-08 14:02:12 +00:00
|
|
|
export enum BoardPageTypes {
|
2026-04-01 08:29:39 +00:00
|
|
|
List = "list",
|
|
|
|
|
Kanban = "kanban",
|
|
|
|
|
StatusGrid = "status-grid",
|
2024-07-23 15:41:03 +02:00
|
|
|
}
|