add note objects

This commit is contained in:
marlon-erler
2024-07-11 19:29:12 +02:00
parent 0a20c7d1d9
commit 6079aeb087
3 changed files with 35 additions and 10 deletions
+15 -5
View File
@@ -1164,7 +1164,7 @@
"div", "div",
{ {
class: "grid gap padding", class: "grid gap padding",
style: "grid-template-columns: repeat(auto-fit, minmax(350px, 1fr))", style: "grid-template-columns: repeat(auto-fill, minmax(350px, 1fr))",
"children:prepend": [chat.objects, objectConverter] "children:prepend": [chat.objects, objectConverter]
} }
) )
@@ -1175,20 +1175,30 @@
// src/Views/Objects/noteObjectsView.tsx // src/Views/Objects/noteObjectsView.tsx
function NoteObjectsView(chat, selectedObject, isShowingObjectModal) { function NoteObjectsView(chat, selectedObject, isShowingObjectModal) {
const objectConverter = (messageObject) => { const objectConverter = (messageObject) => {
const latest = chat.getMostRecentContent(messageObject);
function select() { function select() {
selectedObject.value = messageObject; selectedObject.value = messageObject;
isShowingObjectModal.value = true; isShowingObjectModal.value = true;
} }
return /* @__PURE__ */ createElement("button", { class: "tile", "on:click": select }, /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", null, messageObject.title), /* @__PURE__ */ createElement("span", { class: "secondary" }, messageObject.id))); return /* @__PURE__ */ createElement("button", { class: "tile", "on:click": select }, /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("b", null, messageObject.title), /* @__PURE__ */ createElement("span", { class: "secondary ellipsis" }, latest.noteContent.split("\n")[0])));
}; };
const notes = new ListState();
chat.objects.subscribe(() => {
notes.clear();
chat.objects.value.forEach((messageObject) => {
const latest = chat.getMostRecentContent(messageObject);
if (!latest.noteContent) return;
notes.add(messageObject);
});
});
const content = createProxyState( const content = createProxyState(
[chat.objects], [chat.objects],
() => chat.objects.value.size == 0 ? /* @__PURE__ */ createElement("div", { class: "flex-column width-100 height-100 align-center justify-center secondary" }, translation.noNotes) : /* @__PURE__ */ createElement( () => notes.value.size == 0 ? /* @__PURE__ */ createElement("div", { class: "flex-column width-100 height-100 align-center justify-center secondary" }, translation.noNotes) : /* @__PURE__ */ createElement(
"div", "div",
{ {
class: "grid gap padding", class: "grid gap padding",
style: "grid-template-columns: repeat(auto-fit, minmax(350px, 1fr))", style: "grid-template-columns: repeat(auto-fill, minmax(350px, 1fr))",
"children:prepend": [chat.objects, objectConverter] "children:prepend": [notes, objectConverter]
} }
) )
); );
+1 -1
View File
@@ -35,7 +35,7 @@ export function AllObjectsView(
) : ( ) : (
<div <div
class="grid gap padding" class="grid gap padding"
style="grid-template-columns: repeat(auto-fit, minmax(350px, 1fr))" style="grid-template-columns: repeat(auto-fill, minmax(350px, 1fr))"
children:prepend={[chat.objects, objectConverter]} children:prepend={[chat.objects, objectConverter]}
></div> ></div>
) )
+19 -4
View File
@@ -12,6 +12,8 @@ export function NoteObjectsView(
const objectConverter: React.StateItemConverter<MessageObject> = ( const objectConverter: React.StateItemConverter<MessageObject> = (
messageObject messageObject
) => { ) => {
const latest = chat.getMostRecentContent(messageObject);
function select() { function select() {
selectedObject.value = messageObject; selectedObject.value = messageObject;
isShowingObjectModal.value = true; isShowingObjectModal.value = true;
@@ -21,22 +23,35 @@ export function NoteObjectsView(
<button class="tile" on:click={select}> <button class="tile" on:click={select}>
<div> <div>
<b>{messageObject.title}</b> <b>{messageObject.title}</b>
<span class="secondary">{messageObject.id}</span> <span class="secondary ellipsis">
{latest.noteContent!.split("\n")[0]}
</span>
</div> </div>
</button> </button>
); );
}; };
const notes = new React.ListState<MessageObject>();
chat.objects.subscribe(() => {
notes.clear();
chat.objects.value.forEach((messageObject) => {
const latest = chat.getMostRecentContent(messageObject);
if (!latest.noteContent) return;
notes.add(messageObject);
});
});
const content = React.createProxyState([chat.objects], () => const content = React.createProxyState([chat.objects], () =>
chat.objects.value.size == 0 ? ( notes.value.size == 0 ? (
<div class="flex-column width-100 height-100 align-center justify-center secondary"> <div class="flex-column width-100 height-100 align-center justify-center secondary">
{translation.noNotes} {translation.noNotes}
</div> </div>
) : ( ) : (
<div <div
class="grid gap padding" class="grid gap padding"
style="grid-template-columns: repeat(auto-fit, minmax(350px, 1fr))" style="grid-template-columns: repeat(auto-fill, minmax(350px, 1fr))"
children:prepend={[chat.objects, objectConverter]} children:prepend={[notes, objectConverter]}
></div> ></div>
) )
); );