chore(react/type_widget): port empty workspace switcher

This commit is contained in:
Elian Doran
2025-09-19 18:15:10 +03:00
parent 3dbf20af52
commit 07b86c8cf7
2 changed files with 31 additions and 52 deletions

View File

@@ -1,17 +1,18 @@
import { useEffect, useRef } from "preact/hooks";
import { useCallback, useContext, useEffect, useRef, useState } from "preact/hooks";
import { t } from "../../services/i18n";
import FormGroup from "../react/FormGroup";
import NoteAutocomplete from "../react/NoteAutocomplete";
import "./Empty.css";
import { refToJQuerySelector } from "../react/react_utils";
import { ParentComponent, refToJQuerySelector } from "../react/react_utils";
import note_autocomplete from "../../services/note_autocomplete";
import appContext from "../../components/app_context";
import FNote from "../../entities/fnote";
import search from "../../services/search";
export default function Empty() {
return (
<div class="note-detail-empty note-detail-printable">
<div class="workspace-notes"></div>
<WorkspaceSwitcher />
<NoteSearch />
</div>
)
@@ -55,3 +56,29 @@ function NoteSearch() {
</>
);
}
function WorkspaceSwitcher() {
const [ workspaceNotes, setWorkspaceNotes ] = useState<FNote[]>();
const parentComponent = useContext(ParentComponent);
function refresh() {
search.searchForNotes("#workspace #!template").then(setWorkspaceNotes);
}
useEffect(refresh, []);
return (
<div class="workspace-notes">
{workspaceNotes?.map(workspaceNote => (
<div
className="workspace-note"
title={t("empty.enter_workspace", { title: workspaceNote.title })}
onClick={() => parentComponent?.triggerCommand("hoistNote", { noteId: workspaceNote.noteId })}
>
<div className={`${workspaceNote.getIcon()} workspace-icon`} />
<div>{workspaceNote.title}</div>
</div>
))}
</div>
);
}

View File

@@ -1,48 +0,0 @@
import noteAutocompleteService from "../../services/note_autocomplete.js";
import TypeWidget from "./type_widget.js";
import appContext from "../../components/app_context.js";
import searchService from "../../services/search.js";
import { t } from "../../services/i18n.js";
const TPL = /*html*/`
`;
export default class EmptyTypeWidget extends TypeWidget {
private $autoComplete!: JQuery<HTMLElement>;
private $results!: JQuery<HTMLElement>;
private $workspaceNotes!: JQuery<HTMLElement>;
static getType() {
return "empty";
}
doRender() {
// FIXME: this might be optimized - cleaned up after use since it's always used only for new tab
this.$widget = $(TPL);
this.$autoComplete = this.$widget.find(".note-autocomplete");
this.$results = this.$widget.find(".note-detail-empty-results");
this.$workspaceNotes = this.$widget.find(".workspace-notes");
super.doRender();
}
async doRefresh() {
const workspaceNotes = await searchService.searchForNotes("#workspace #!template");
this.$workspaceNotes.empty();
for (const workspaceNote of workspaceNotes) {
this.$workspaceNotes.append(
$('<div class="workspace-note">')
.append($("<div>").addClass(`${workspaceNote.getIcon()} workspace-icon`))
.append($("<div>").text(workspaceNote.title))
.attr("title", t("empty.enter_workspace", { title: workspaceNote.title }))
.on("click", () => this.triggerCommand("hoistNote", { noteId: workspaceNote.noteId }))
);
}
this.$autoComplete.trigger("focus").trigger("select");
}
}