feat(layout): integrate search parameters ribbon tab

This commit is contained in:
Elian Doran 2025-12-14 20:34:55 +02:00
parent 272888acab
commit 6b9b9a96c3
No known key found for this signature in database
4 changed files with 25 additions and 5 deletions

View File

@ -14,6 +14,10 @@ body.experimental-feature-new-layout {
padding-bottom: 0.2em; padding-bottom: 0.2em;
font-size: 0.8em; font-size: 0.8em;
.collapsible-title {
font-size: 1rem;
}
.dropdown-menu { .dropdown-menu {
input.form-control { input.form-control {
padding: 2px 8px; padding: 2px 8px;

View File

@ -1,15 +1,31 @@
import CollectionProperties from "../note_bars/CollectionProperties";
import { useNoteContext, useNoteProperty } from "../react/hooks";
import "./NoteTitleActions.css"; import "./NoteTitleActions.css";
import FNote from "../../entities/fnote";
import { t } from "../../services/i18n";
import CollectionProperties from "../note_bars/CollectionProperties";
import Collapsible from "../react/Collapsible";
import { useNoteContext, useNoteProperty } from "../react/hooks";
import SearchDefinitionTab from "../ribbon/SearchDefinitionTab";
export default function NoteTitleActions() { export default function NoteTitleActions() {
const { note } = useNoteContext(); const { note, ntxId } = useNoteContext();
const isHiddenNote = note && note.noteId !== "_search" && note.noteId.startsWith("_"); const isHiddenNote = note && note.noteId !== "_search" && note.noteId.startsWith("_");
const noteType = useNoteProperty(note, "type"); const noteType = useNoteProperty(note, "type");
return ( return (
<div className="title-actions"> <div className="title-actions">
{note && noteType === "search" && <SearchProperties note={note} ntxId={ntxId} />}
{note && !isHiddenNote && noteType === "book" && <CollectionProperties note={note} />} {note && !isHiddenNote && noteType === "book" && <CollectionProperties note={note} />}
</div> </div>
); );
} }
function SearchProperties({ note, ntxId }: { note: FNote, ntxId: string | null | undefined }) {
return (
<Collapsible
title={t("search_definition.search_parameters")}
>
<SearchDefinitionTab note={note} ntxId={ntxId} hidden={false} />
</Collapsible>
);
}

View File

@ -47,7 +47,7 @@ export const RIBBON_TAB_DEFINITIONS: TabConfiguration[] = [
icon: "bx bx-search", icon: "bx bx-search",
content: SearchDefinitionTab, content: SearchDefinitionTab,
activate: true, activate: true,
show: ({ note }) => note?.type === "search" show: ({ note }) => !isNewLayout && note?.type === "search"
}, },
{ {
title: t("edited_notes.title"), title: t("edited_notes.title"),

View File

@ -24,7 +24,7 @@ import { ParentComponent } from "../react/react_utils";
import { TabContext } from "./ribbon-interface"; import { TabContext } from "./ribbon-interface";
import { SEARCH_OPTIONS, SearchOption } from "./SearchDefinitionOptions"; import { SEARCH_OPTIONS, SearchOption } from "./SearchDefinitionOptions";
export default function SearchDefinitionTab({ note, ntxId, hidden }: TabContext) { export default function SearchDefinitionTab({ note, ntxId, hidden }: Pick<TabContext, "note" | "ntxId" | "hidden">) {
const parentComponent = useContext(ParentComponent); const parentComponent = useContext(ParentComponent);
const [ searchOptions, setSearchOptions ] = useState<{ availableOptions: SearchOption[], activeOptions: SearchOption[] }>(); const [ searchOptions, setSearchOptions ] = useState<{ availableOptions: SearchOption[], activeOptions: SearchOption[] }>();
const [ error, setError ] = useState<{ message: string }>(); const [ error, setError ] = useState<{ message: string }>();