show results in filter modal, support regex in search

This commit is contained in:
marlon-erler
2024-07-15 17:15:52 +02:00
parent 8629bd5fc8
commit f49b9b7f01
2 changed files with 27 additions and 10 deletions
+12 -5
View File
@@ -2095,9 +2095,11 @@
} }
function updateObjects() { function updateObjects() {
const allObjects = [...chat.objects.value.entries()]; const allObjects = [...chat.objects.value.entries()];
const matchingObjects = allObjects.filter( const matchingObjects = allObjects.filter((entry) => {
(entry) => entry[1].title.indexOf(appliedFilter.value) != -1 let objectTitle = entry[1].title || translation.untitledObject;
); const regex = new RegExp(appliedFilter.value.toLowerCase());
return regex.test(objectTitle.toLowerCase());
});
resultCount.value = matchingObjects.length; resultCount.value = matchingObjects.length;
messageObjects.clear(); messageObjects.clear();
matchingObjects.forEach((entry) => messageObjects.set(...entry)); matchingObjects.forEach((entry) => messageObjects.set(...entry));
@@ -2159,7 +2161,7 @@
class: "object-content width-100 height-100 flex scroll-no", class: "object-content width-100 height-100 flex scroll-no",
"children:set": mainView "children:set": mainView
} }
), /* @__PURE__ */ createElement("div", { "children:set": objectModal }), /* @__PURE__ */ createElement("div", { class: "modal", "toggle:open": isShowingFilterModel }, /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("main", null, /* @__PURE__ */ createElement("h2", null, translation.filterObjects), /* @__PURE__ */ createElement("div", { class: "flex-column" }, /* @__PURE__ */ createElement("label", { class: "tile" }, /* @__PURE__ */ createElement("span", { class: "icon" }, "search"), /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("span", null, translation.searchByTitle), /* @__PURE__ */ createElement( ), /* @__PURE__ */ createElement("div", { class: "modal", "toggle:open": isShowingFilterModel }, /* @__PURE__ */ createElement("div", { style: "max-width: unset; width: 100%" }, /* @__PURE__ */ createElement("main", null, /* @__PURE__ */ createElement("h2", null, translation.filterObjects), /* @__PURE__ */ createElement("div", { class: "flex-column" }, /* @__PURE__ */ createElement("label", { class: "tile" }, /* @__PURE__ */ createElement("span", { class: "icon" }, "search"), /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("span", null, translation.searchByTitle), /* @__PURE__ */ createElement(
"input", "input",
{ {
"bind:value": filterInput, "bind:value": filterInput,
@@ -2174,7 +2176,12 @@
"toggle:disabled": cannotReset "toggle:disabled": cannotReset
}, },
translation.reset translation.reset
), /* @__PURE__ */ createElement("button", { class: "width-50 flex primary", "on:click": applyFilter }, translation.search, /* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_forward"))), /* @__PURE__ */ createElement("hr", null), /* @__PURE__ */ createElement("span", { class: "secondary", "subscribe:innerText": resultText })), /* @__PURE__ */ createElement("button", { "on:click": closeFilters }, translation.close, /* @__PURE__ */ createElement("span", { class: "icon" }, "close"))))); ), /* @__PURE__ */ createElement("button", { class: "width-50 flex primary", "on:click": applyFilter }, translation.search, /* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_forward"))), /* @__PURE__ */ createElement("hr", null), /* @__PURE__ */ createElement("span", { class: "secondary", "subscribe:innerText": resultText }), ObjectGridView(
chat,
messageObjects,
selectedObject,
isShowingObjectModal
)), /* @__PURE__ */ createElement("button", { "on:click": closeFilters }, translation.close, /* @__PURE__ */ createElement("span", { class: "icon" }, "close")))), /* @__PURE__ */ createElement("div", { "children:set": objectModal }));
} }
function ViewTypeToggle(key, selection) { function ViewTypeToggle(key, selection) {
const [label, icon] = viewTypes[key]; const [label, icon] = viewTypes[key];
+15 -5
View File
@@ -6,6 +6,7 @@ import { AllObjectsView } from "./allObjectsView";
import { KanbanView } from "./kanbanView"; import { KanbanView } from "./kanbanView";
import { NoteObjectsView } from "./noteObjectsView"; import { NoteObjectsView } from "./noteObjectsView";
import { ObjectDetailModal } from "./objectDetailModal"; import { ObjectDetailModal } from "./objectDetailModal";
import { ObjectGridView } from "./objectGridView";
import { StatusView } from "./statusView"; import { StatusView } from "./statusView";
import { icons } from "../../icons"; import { icons } from "../../icons";
import { translation } from "../../translations"; import { translation } from "../../translations";
@@ -63,9 +64,11 @@ export function ObjectPane(chat: Chat) {
function updateObjects() { function updateObjects() {
const allObjects = [...chat.objects.value.entries()]; const allObjects = [...chat.objects.value.entries()];
const matchingObjects = allObjects.filter( const matchingObjects = allObjects.filter((entry) => {
(entry) => entry[1].title.indexOf(appliedFilter.value) != -1 let objectTitle = entry[1].title || translation.untitledObject;
); const regex = new RegExp(appliedFilter.value.toLowerCase());
return regex.test(objectTitle.toLowerCase());
});
resultCount.value = matchingObjects.length; resultCount.value = matchingObjects.length;
messageObjects.clear(); messageObjects.clear();
matchingObjects.forEach((entry) => messageObjects.set(...entry)); matchingObjects.forEach((entry) => messageObjects.set(...entry));
@@ -140,9 +143,8 @@ export function ObjectPane(chat: Chat) {
children:set={mainView} children:set={mainView}
></div> ></div>
<div children:set={objectModal}></div>
<div class="modal" toggle:open={isShowingFilterModel}> <div class="modal" toggle:open={isShowingFilterModel}>
<div> <div style="max-width: unset; width: 100%">
<main> <main>
<h2>{translation.filterObjects}</h2> <h2>{translation.filterObjects}</h2>
@@ -176,6 +178,13 @@ export function ObjectPane(chat: Chat) {
<hr></hr> <hr></hr>
<span class="secondary" subscribe:innerText={resultText}></span> <span class="secondary" subscribe:innerText={resultText}></span>
{ObjectGridView(
chat,
messageObjects,
selectedObject,
isShowingObjectModal
)}
</main> </main>
<button on:click={closeFilters}> <button on:click={closeFilters}>
{translation.close} {translation.close}
@@ -183,6 +192,7 @@ export function ObjectPane(chat: Chat) {
</button> </button>
</div> </div>
</div> </div>
<div children:set={objectModal}></div>
</div> </div>
); );
} }