From 169f1fea2f572cda82b78ca608fdb836ffb8dd76 Mon Sep 17 00:00:00 2001 From: marlon-erler Date: Tue, 23 Jul 2024 00:05:48 +0200 Subject: [PATCH] add list to BoardPage --- bun.lockb | Bin 11788 -> 11789 bytes dist/index.js | 55 ++++++++++++++++------- package.json | 2 +- src/View/ChatPages/taskPage.tsx | 11 ++++- src/View/Components/boardEntry.tsx | 21 +++++++++ src/ViewModel/Pages/taskPageViewModel.ts | 20 +++++++-- 6 files changed, 89 insertions(+), 20 deletions(-) create mode 100644 src/View/Components/boardEntry.tsx diff --git a/bun.lockb b/bun.lockb index 983033214a7095abe7993ed6d660d973c265fadf..75eba036b15f65dfcc24752fae1e1faf533c6e64 100755 GIT binary patch delta 160 zcmV;R0AK%%T#a0iE+I34Zjo+me)4<(k&i<1fPK#Y@8Rfdo~97mPM`c7UTl4_PaO#j zM*skT0RR910{{R33X@?1CzGH82m#HrsR_&rKz$Y-F>_vjmkkvh%$zJdWJ;6w_`b#d zD1SVe1J|FOrNqHOGbf<5ez!Oq;DD}{h5&kvgP(plyo~&aAt)h}SS_>=@Ivwc delta 160 zcmV;R0AK%&T#Q_hE+OBXD;s)-FwlQH8peCW4MIKoB4b9If}QTSX*-7hXTf~2PaO#j zMgRbS0RR910{{R336o(0CzGH82m#EqsR_&rK!RUcs+I5hi!hLb&felzS}l`Fpxd9K zSs>l;3LVWKVj-PpPf5E;f>rfF@>G9*46KH^$mZ?E=rPR6c#b?I3bVBpnGFGSvri-F O2?05ikS8FMSuM20ltcso diff --git a/dist/index.js b/dist/index.js index c2bcc660..f358b9cb 100644 --- a/dist/index.js +++ b/dist/index.js @@ -260,9 +260,9 @@ } }); } catch (error) { + console.error(error); throw `error: cannot process subscribe:children directive. - Error: ${error} - Usage: "subscribe:children={[list, converter]}"; you can find a more detailed example in the documentation.`; + Usage: "children:append={[list, converter]}"; you can find a more detailed example in the documentation.`; } } } @@ -1276,12 +1276,6 @@ }; // load loadData = () => { - this.cannotSendMessage = createProxyState( - [this.chatViewModel.settingsViewModel.username, this.composingMessage], - () => this.chatViewModel.settingsViewModel.username.value == "" || this.composingMessage.value == "" - ); - }; - loadMessages = () => { for (const chatMessage of this.chatViewModel.chatModel.messages) { this.addChatMessage(chatMessage); } @@ -1289,7 +1283,10 @@ // init constructor(chatViewModel) { this.chatViewModel = chatViewModel; - this.loadData(); + this.cannotSendMessage = createProxyState( + [this.chatViewModel.settingsViewModel.username, this.composingMessage], + () => this.chatViewModel.settingsViewModel.username.value == "" || this.composingMessage.value == "" + ); } }; @@ -1360,10 +1357,6 @@ loadListRelevantData = () => { this.primaryChannel.value = this.chatViewModel.chatModel.info.primaryChannel; this.color.value = this.chatViewModel.chatModel.color; - this.cannotSetEncryptionKey = createProxyState( - [this.encryptionKeyInput], - () => this.encryptionKeyInput.value == this.chatViewModel.chatModel.info.encryptionKey - ); }; loadData = () => { this.primaryChannelInput.value = this.chatViewModel.chatModel.info.primaryChannel; @@ -1380,6 +1373,10 @@ constructor(chatViewModel) { this.chatViewModel = chatViewModel; this.loadListRelevantData(); + this.cannotSetEncryptionKey = createProxyState( + [this.encryptionKeyInput], + () => this.encryptionKeyInput.value == this.chatViewModel.chatModel.info.encryptionKey + ); } }; @@ -1399,6 +1396,17 @@ if (this.cannotCreateBoard.value == true) return; this.taskModel.createBoard(this.newBoardNameInput.value); this.newBoardNameInput.value = ""; + this.loadData(); + }; + // load + loadData = () => { + this.boards.clear(); + const boardIds = this.taskModel.listBoardIds(); + for (const boardId of boardIds) { + const boardInfo = this.taskModel.getBoardInfo(boardId); + if (boardInfo == null) continue; + this.boards.add(boardInfo); + } }; // init constructor(taskModel, storageModel2) { @@ -1730,7 +1738,7 @@ // src/View/ChatPages/messagePage.tsx function MessagePage(messagePageViewModel) { - messagePageViewModel.loadMessages(); + messagePageViewModel.loadData(); const messageContainer = /* @__PURE__ */ createElement( "div", { @@ -1917,8 +1925,18 @@ ))))); } + // src/View/Components/boardEntry.tsx + function BoardEntry(boardInfo) { + const view = /* @__PURE__ */ createElement("button", { color: boardInfo.color, class: "tile" }, /* @__PURE__ */ createElement("b", null, boardInfo.name)); + return view; + } + var BoardInfoToEntry = (boardInfo) => { + return BoardEntry(boardInfo); + }; + // src/View/ChatPages/taskPage.tsx function TaskPage(taskPageViewModel) { + taskPageViewModel.loadData(); return /* @__PURE__ */ createElement("div", { id: "task-page" }, /* @__PURE__ */ createElement("div", { class: "pane side" }, /* @__PURE__ */ createElement("div", { class: "content" }, /* @__PURE__ */ createElement("div", { class: "flex-row width-input" }, /* @__PURE__ */ createElement( "input", { @@ -1935,7 +1953,14 @@ "toggle:disabled": taskPageViewModel.cannotCreateBoard }, /* @__PURE__ */ createElement("span", { class: "icon" }, "add") - )), /* @__PURE__ */ createElement("div", { class: "flex-row gap" }))), /* @__PURE__ */ createElement("div", { class: "pane" }, /* @__PURE__ */ createElement("div", { class: "toolbar" }), /* @__PURE__ */ createElement("div", { class: "content" }))); + )), /* @__PURE__ */ createElement("hr", null), /* @__PURE__ */ createElement( + "div", + { + class: "grid gap", + style: "grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr))", + "children:append": [taskPageViewModel.boards, BoardInfoToEntry] + } + ))), /* @__PURE__ */ createElement("div", { class: "pane" }, /* @__PURE__ */ createElement("div", { class: "toolbar" }), /* @__PURE__ */ createElement("div", { class: "content" }))); } // src/View/chatPage.tsx diff --git a/package.json b/package.json index 912faca4..4e75dfe6 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "dependencies": { "@types/uuid": "^10.0.0", - "bloatless-react": "^1.3.9", + "bloatless-react": "^1.3.10", "esbuild": "^0.23.0", "udn-frontend": "^1.0.8", "uuid": "^10.0.0" diff --git a/src/View/ChatPages/taskPage.tsx b/src/View/ChatPages/taskPage.tsx index 35bab475..e15092d5 100644 --- a/src/View/ChatPages/taskPage.tsx +++ b/src/View/ChatPages/taskPage.tsx @@ -1,9 +1,12 @@ import * as React from "bloatless-react"; +import { BoardInfoToEntry } from "../Components/boardEntry"; import TaskPageViewModel from "../../ViewModel/Pages/taskPageViewModel"; import { translations } from "../translations"; export function TaskPage(taskPageViewModel: TaskPageViewModel) { + taskPageViewModel.loadData(); + return (
@@ -26,7 +29,13 @@ export function TaskPage(taskPageViewModel: TaskPageViewModel) {
-
+
+ +
diff --git a/src/View/Components/boardEntry.tsx b/src/View/Components/boardEntry.tsx new file mode 100644 index 00000000..559017e9 --- /dev/null +++ b/src/View/Components/boardEntry.tsx @@ -0,0 +1,21 @@ +import "./chatEntry.css"; + +import * as React from "bloatless-react"; + +import { BoardInfoFileContent } from "../../Model/Files/taskModel"; + +export function BoardEntry(boardInfo: BoardInfoFileContent) { + const view = ( + + ); + + return view; +} + +export const BoardInfoToEntry: React.StateItemConverter< + BoardInfoFileContent +> = (boardInfo: BoardInfoFileContent) => { + return BoardEntry(boardInfo); +}; diff --git a/src/ViewModel/Pages/taskPageViewModel.ts b/src/ViewModel/Pages/taskPageViewModel.ts index 442f2850..e1025ab2 100644 --- a/src/ViewModel/Pages/taskPageViewModel.ts +++ b/src/ViewModel/Pages/taskPageViewModel.ts @@ -1,8 +1,6 @@ import * as React from "bloatless-react"; -import TaskModel, { - BoardInfoFileContent, -} from "../../Model/Files/taskModel"; +import TaskModel, { BoardInfoFileContent } from "../../Model/Files/taskModel"; import StorageModel from "../../Model/Global/storageModel"; @@ -26,6 +24,22 @@ export default class TaskPageViewModel { this.taskModel.createBoard(this.newBoardNameInput.value); this.newBoardNameInput.value = ""; + + this.loadData(); + }; + + // load + loadData = (): void => { + this.boards.clear(); + + const boardIds: string[] = this.taskModel.listBoardIds(); + for (const boardId of boardIds) { + const boardInfo: BoardInfoFileContent | null = + this.taskModel.getBoardInfo(boardId); + if (boardInfo == null) continue; + + this.boards.add(boardInfo); + } }; // init