diff --git a/dist/index.js b/dist/index.js index 8ac2e560..45d5422f 100644 --- a/dist/index.js +++ b/dist/index.js @@ -1587,13 +1587,14 @@ // src/ViewModel/Pages/calendarPageViewModel.ts var CalendarPageViewModel = class { // init - constructor(coreViewModel, storageModel2, calendarModel, boardAndTasksModel) { + constructor(coreViewModel, storageModel2, calendarModel, boardAndTasksModel, chatViewModel) { this.coreViewModel = coreViewModel; this.storageModel = storageModel2; this.calendarModel = calendarModel; this.boardsAndTasksModel = boardAndTasksModel; + this.chatViewModel = chatViewModel; bulkSubscribe([this.selectedYear, this.selectedMonth], () => { - this.loadTasks(); + this.loadMonthTasks(); }); boardAndTasksModel.taskHandlerManager.addHandler( (taskFileContent) => { @@ -1604,6 +1605,7 @@ storageModel; calendarModel; boardsAndTasksModel; + chatViewModel; // data get monthString() { return CalendarModel.getMonthString( @@ -1620,7 +1622,7 @@ selectedMonth = new State(0); selectedDate = new State(0); monthGrid = new State(void 0); - selectedTaskViewModel = new State(void 0); + taskViewModelsToShow = new ListState(); // view getTaskMapState = (taskFileContent) => { if (this.monthGrid.value == null) return null; @@ -1673,7 +1675,7 @@ }; // storage // load - loadTasks = () => { + loadMonthTasks = () => { this.monthGrid.value = this.calendarModel.generateMonthGrid( this.selectedYear.value, this.selectedMonth.value, @@ -1687,7 +1689,7 @@ } }; loadData = () => { - this.loadTasks(); + this.loadMonthTasks(); this.showToday(); }; }; @@ -2217,7 +2219,8 @@ coreViewModel, this.storageModel, this.chatModel.fileModel.boardsAndTasksModel.calendarModel, - this.chatModel.fileModel.boardsAndTasksModel + this.chatModel.fileModel.boardsAndTasksModel, + this ); this.taskPageViewModel = new TaskPageViewModel( this.coreViewModel, @@ -2572,6 +2575,51 @@ }))); } + // src/View/Components/taskEntry.tsx + function TaskEntry(taskViewModel) { + const details = { + description: taskViewModel.description.value || "---", + priority_high: taskViewModel.priority.value || "---", + category: taskViewModel.category.value || "---", + clock_loader_40: taskViewModel.status.value || "---", + calendar_month: taskViewModel.date.value || "---", + schedule: taskViewModel.time.value || "---" + }; + const view = /* @__PURE__ */ createElement( + "button", + { + draggable: "true", + class: "tile flex-no", + style: "user-select: none; -webkit-user-select: none", + "on:click": taskViewModel.open, + "on:dragstart": taskViewModel.dragStart + }, + /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", { "subscribe:innerText": taskViewModel.name }), /* @__PURE__ */ createElement("hr", null), /* @__PURE__ */ createElement( + "div", + { + class: "grid secondary", + style: "grid-template-columns: repeat(2, 1fr); column-gap: 1rem; row-gap: .5rem" + }, + ...Object.entries(details).map((entry) => /* @__PURE__ */ createElement( + "span", + { + class: "flex-row align-center width-100 flex-no clip", + style: "gap: 1rem" + }, + /* @__PURE__ */ createElement("span", { class: "icon", style: "font-size: 1.1rem" }, entry[0]), + /* @__PURE__ */ createElement("span", { class: "ellipsis" }, entry[1]) + )) + )) + ); + taskViewModel.index.subscribe((newIndex) => { + view.style.order = newIndex; + }); + return view; + } + var TaskViewModelToEntry = (taskViewModel) => { + return TaskEntry(taskViewModel); + }; + // src/View/ChatPages/calendarPage.tsx function CalendarPage(calendarPageViewModel) { calendarPageViewModel.loadData(); @@ -2588,6 +2636,27 @@ } } ); + const sidePaneContent = createProxyState( + [ + calendarPageViewModel.selectedYear, + calendarPageViewModel.selectedMonth, + calendarPageViewModel.selectedDate + ], + () => { + const listState = calendarPageViewModel.monthGrid.value?.days[calendarPageViewModel.selectedDate.toString()]; + if (listState == void 0) { + return /* @__PURE__ */ createElement("div", null); + } else { + return /* @__PURE__ */ createElement( + "div", + { + class: "flex-column gap", + "children:append": [listState, TaskViewModelToEntry] + } + ); + } + } + ); return /* @__PURE__ */ createElement("div", { id: "calendar-page" }, /* @__PURE__ */ createElement("div", { class: "pane-wrapper" }, /* @__PURE__ */ createElement("div", { class: "pane" }, /* @__PURE__ */ createElement("div", { class: "toolbar" }, /* @__PURE__ */ createElement("span", null, /* @__PURE__ */ createElement( "button", { @@ -2637,7 +2706,14 @@ "aria-label": translations.chatPage.task.createTaskButtonAudioLabel }, /* @__PURE__ */ createElement("span", { class: "icon" }, "add") - ))), /* @__PURE__ */ createElement("div", { class: "content", "children:set": mainContent }))), /* @__PURE__ */ createElement("div", { class: "pane-wrapper side" }, /* @__PURE__ */ createElement("div", { class: "pane" }, "hello"))); + ))), /* @__PURE__ */ createElement("div", { class: "content", "children:set": mainContent }))), /* @__PURE__ */ createElement( + "div", + { + class: "pane-wrapper side background", + "set:color": calendarPageViewModel.chatViewModel.displayedColor + }, + /* @__PURE__ */ createElement("div", { class: "pane" }, /* @__PURE__ */ createElement("div", { class: "content", "children:set": sidePaneContent })) + )); } // src/View/Components/ribbonButton.tsx @@ -3026,51 +3102,6 @@ } }; - // src/View/Components/taskEntry.tsx - function TaskEntry(taskViewModel) { - const details = { - description: taskViewModel.description.value || "---", - priority_high: taskViewModel.priority.value || "---", - category: taskViewModel.category.value || "---", - clock_loader_40: taskViewModel.status.value || "---", - calendar_month: taskViewModel.date.value || "---", - schedule: taskViewModel.time.value || "---" - }; - const view = /* @__PURE__ */ createElement( - "button", - { - draggable: "true", - class: "tile flex-no", - style: "user-select: none; -webkit-user-select: none", - "on:click": taskViewModel.open, - "on:dragstart": taskViewModel.dragStart - }, - /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", { "subscribe:innerText": taskViewModel.name }), /* @__PURE__ */ createElement("hr", null), /* @__PURE__ */ createElement( - "div", - { - class: "grid secondary", - style: "grid-template-columns: repeat(2, 1fr); column-gap: 1rem; row-gap: .5rem" - }, - ...Object.entries(details).map((entry) => /* @__PURE__ */ createElement( - "span", - { - class: "flex-row align-center width-100 flex-no clip", - style: "gap: 1rem" - }, - /* @__PURE__ */ createElement("span", { class: "icon", style: "font-size: 1.1rem" }, entry[0]), - /* @__PURE__ */ createElement("span", { class: "ellipsis" }, entry[1]) - )) - )) - ); - taskViewModel.index.subscribe((newIndex) => { - view.style.order = newIndex; - }); - return view; - } - var TaskViewModelToEntry = (taskViewModel) => { - return TaskEntry(taskViewModel); - }; - // src/View/ChatPages/boardKanbanPage.tsx function BoardKanbanPage(boardViewModel) { return PropertyValueList( @@ -3620,7 +3651,14 @@ ] } ))) - ), /* @__PURE__ */ createElement("div", { id: "board-content", class: "pane-wrapper", "children:set": paneContent })); + ), /* @__PURE__ */ createElement( + "div", + { + id: "board-content", + class: "pane-wrapper", + "children:set": paneContent + } + )); } // src/View/chatPage.tsx diff --git a/src/View/ChatPages/calendarPage.tsx b/src/View/ChatPages/calendarPage.tsx index fca88b76..af4fd23d 100644 --- a/src/View/ChatPages/calendarPage.tsx +++ b/src/View/ChatPages/calendarPage.tsx @@ -4,6 +4,7 @@ import * as React from "bloatless-react"; import CalendarPageViewModel from "../../ViewModel/Pages/calendarPageViewModel"; import { MonthGrid } from "../Components/monthGrid"; +import { TaskViewModelToEntry } from "../Components/taskEntry"; import { translations } from "../translations"; export function CalendarPage(calendarPageViewModel: CalendarPageViewModel) { @@ -23,6 +24,31 @@ export function CalendarPage(calendarPageViewModel: CalendarPageViewModel) { } ); + const sidePaneContent = React.createProxyState( + [ + calendarPageViewModel.selectedYear, + calendarPageViewModel.selectedMonth, + calendarPageViewModel.selectedDate, + ], + () => { + const listState = + calendarPageViewModel.monthGrid.value?.days[ + calendarPageViewModel.selectedDate.toString() + ]; + + if (listState == undefined) { + return
; + } else { + return ( + + ); + } + } + ); + return (