diff --git a/apps/client/src/layouts/desktop_layout.tsx b/apps/client/src/layouts/desktop_layout.tsx index 511f6f9c00..4570e70ef3 100644 --- a/apps/client/src/layouts/desktop_layout.tsx +++ b/apps/client/src/layouts/desktop_layout.tsx @@ -30,6 +30,7 @@ import SpacerWidget from "../widgets/launch_bar/SpacerWidget.jsx"; import InlineTitle from "../widgets/layout/InlineTitle.jsx"; import NoteBadges from "../widgets/layout/NoteBadges.jsx"; import NoteTitleActions from "../widgets/layout/NoteTitleActions.jsx"; +import StandaloneWarningBar from "../widgets/layout/StandaloneWarningBar.jsx"; import StatusBar from "../widgets/layout/StatusBar.jsx"; import NoteIconWidget from "../widgets/note_icon.jsx"; import NoteTitleWidget from "../widgets/note_title.jsx"; @@ -186,6 +187,7 @@ export default class DesktopLayout { ) ) .optChild(launcherPaneIsHorizontal && isNewLayout, ) + .optChild(glob.isStandalone, ) .child() // Desktop-specific dialogs. diff --git a/apps/client/src/layouts/mobile_layout.tsx b/apps/client/src/layouts/mobile_layout.tsx index 8b162bced3..1a5b1d27a7 100644 --- a/apps/client/src/layouts/mobile_layout.tsx +++ b/apps/client/src/layouts/mobile_layout.tsx @@ -13,6 +13,7 @@ import LauncherContainer from "../widgets/launch_bar/LauncherContainer.jsx"; import InlineTitle from "../widgets/layout/InlineTitle.jsx"; import NoteBadges from "../widgets/layout/NoteBadges.jsx"; import NoteTitleActions from "../widgets/layout/NoteTitleActions.jsx"; +import StandaloneWarningBar from "../widgets/layout/StandaloneWarningBar"; import MobileDetailMenu from "../widgets/mobile_widgets/mobile_detail_menu.js"; import ScreenContainer from "../widgets/mobile_widgets/screen_container.js"; import SidebarContainer from "../widgets/mobile_widgets/sidebar_container.js"; @@ -24,9 +25,7 @@ import NoteWrapperWidget from "../widgets/note_wrapper.js"; import NoteDetail from "../widgets/NoteDetail.jsx"; import QuickSearchWidget from "../widgets/quick_search.js"; import { useNoteContext } from "../widgets/react/hooks.jsx"; -import StandaloneRibbonAdapter from "../widgets/ribbon/components/StandaloneRibbonAdapter.jsx"; import FilePropertiesTab from "../widgets/ribbon/FilePropertiesTab.jsx"; -import SearchDefinitionTab from "../widgets/ribbon/SearchDefinitionTab.jsx"; import SearchResult from "../widgets/search_result.jsx"; import MobileEditorToolbar from "../widgets/type_widgets/text/mobile_editor_toolbar.jsx"; import { applyModals } from "./layout_commons.js"; @@ -58,6 +57,7 @@ export default class MobileLayout { .child( new SplitNoteContainer(() => new NoteWrapperWidget() + .optChild(glob.isStandalone, ) .child( new FlexContainer("row") .class("title-row note-split-title") diff --git a/apps/client/src/widgets/layout/StandaloneWarningBar.tsx b/apps/client/src/widgets/layout/StandaloneWarningBar.tsx new file mode 100644 index 0000000000..43a2c8af5f --- /dev/null +++ b/apps/client/src/widgets/layout/StandaloneWarningBar.tsx @@ -0,0 +1,26 @@ +import { isMobile } from "../../services/utils"; +import Admonition from "../react/Admonition"; + +export default function StandaloneWarningBar() { + return ( +
+ + {isMobile() + ? "Running Trilium standalone. Beware of data loss and other issues." + : "You are running Trilium in standalone mode. Some features are not available, and you may experience issues or data loss. Use the desktop application or self-hosted server for the best experience." + } + +
+ ); +} diff --git a/apps/client/src/widgets/react/Admonition.tsx b/apps/client/src/widgets/react/Admonition.tsx index 5fb86daf2a..726bb1b445 100644 --- a/apps/client/src/widgets/react/Admonition.tsx +++ b/apps/client/src/widgets/react/Admonition.tsx @@ -1,15 +1,16 @@ -import { ComponentChildren } from "preact"; +import { HTML } from "mermaid/dist/diagram-api/types.js"; +import { ComponentChildren, HTMLAttributes } from "preact"; -interface AdmonitionProps { +interface AdmonitionProps extends Pick, "style"> { type: "warning" | "note" | "caution"; children: ComponentChildren; className?: string; } -export default function Admonition({ type, children, className }: AdmonitionProps) { +export default function Admonition({ type, children, className, ...props }: AdmonitionProps) { return ( -
+
{children}
- ) + ); }