Add search panel

src/client/components/center/search/index.ts

@@ -0,0 +1,2 @@
+export * from "./search.service";
+export * from "./search";

src/client/components/center/search/search.service.ts

@@ -0,0 +1,41 @@
+import { makeAutoObservable } from "mobx";
+
+import { CentralViewType } from "@/client/constants";
+import { ICentralPanelContentService } from "@/client/interface";
+import { DomainManager } from "@/domain";
+
+import { EntrySearchService } from "../../shared/entry-search-field";
+
+export class SearchService implements ICentralPanelContentService {
+    entrySearch: EntrySearchService;
+
+    constructor(domain: DomainManager) {
+        this.entrySearch = new EntrySearchService(domain);
+
+        makeAutoObservable(this, { entrySearch: false });
+    }
+
+    get key() {
+        return this.type;
+    }
+
+    get type() {
+        return CentralViewType.Search;
+    }
+
+    get details() {
+        return { type: this.type };
+    }
+
+    load() {
+        return;
+    }
+
+    activate() {
+        return;
+    }
+
+    cleanUp() {
+        return;
+    }
+}

src/client/components/center/search/search.tsx

@@ -0,0 +1,24 @@
+import { Box, Title } from "@mantine/core";
+import { observer } from "mobx-react-lite";
+
+import { DIVIDER, SPACE } from "@/shared/common";
+
+import { SearchService } from "./search.service";
+import { EntrySearchField } from "../../shared/entry-search-field";
+
+interface SearchProps {
+    service: SearchService;
+}
+
+function renderSearch({ service }: SearchProps) {
+    return (
+        <Box className="search">
+            <Title order={1}>Search Results</Title>
+            {DIVIDER}
+            {SPACE}
+            <EntrySearchField service={service.entrySearch} />
+        </Box>
+    );
+}
+
+export const Search = observer(renderSearch);

src/client/components/shared/entry-search-field/entry-search-field.service.ts

@@ -49,6 +49,10 @@ export class EntrySearchService {
         });
     }
 
+    get enabled() {
+        return this._domain.hasProject;
+    }
+
     get searchQuery() {
         return this._searchQuery;
     }

src/client/components/shared/entry-search-field/entry-search-field.tsx

@@ -13,6 +13,7 @@ interface EntrySearchProps {
 function renderEntrySearchField({ service }: EntrySearchProps) {
     return (
         <SearchField
+            disabled={!service.enabled}
             onValueChange={(value) => service.selectEntrySearchResult(value)}
             getSearch={() => service.searchQuery}
             onSearchChange={(value) => (service.searchQuery = value)}

src/client/constants/view.ts

@@ -10,6 +10,7 @@ export enum ViewAction {
 export enum CentralViewType {
     Home = "HOME",
     Settings = "SETTINGS",
+    Search = "SEARCH",
     EntryEditor = "ENTRY_EDITOR",
 }
 

src/shared/search-field/search-field.tsx

@@ -26,6 +26,7 @@ export interface SearchFieldProps extends ComboboxProps {
 
 function renderSearchField({
     placeholder = "Search",
+    disabled = false,
     value,
     getValue,
     search,
@@ -72,6 +73,7 @@ function renderSearchField({
     return (
         <Combobox
             store={combobox}
+            disabled={disabled}
             onOptionSubmit={(value, props) => {
                 onSearchChange?.(props.children?.toString() ?? "");
                 onValueChange?.(value);
@@ -81,6 +83,7 @@ function renderSearchField({
         >
             <Combobox.Target>
                 <InputBase
+                    disabled={disabled}
                     placeholder={placeholder}
                     value={_search}
                     onChange={(event) => {