Add a blank page when no tab is open

This commit is contained in:
Hakan Shehu
2025-01-29 09:46:08 +01:00
parent c965928022
commit 5b9f81e056
4 changed files with 25 additions and 7 deletions

View File

@@ -0,0 +1,12 @@
export const ContainerBlank = () => {
return (
<div className="h-full w-full bg-white flex flex-col gap-1">
<div className="h-10 app-drag-region"></div>
<div className="flex-grow flex items-center justify-center">
<p className="text-sm text-muted-foreground">
What did you get done this week?
</p>
</div>
</div>
);
};

View File

@@ -1,6 +1,7 @@
import { Resizable } from 're-resizable';
import { ContainerTabs } from '@/renderer/components/layouts/containers/container-tabs';
import { ContainerBlank } from '@/renderer/components/layouts/containers/container-blank';
import { Sidebar } from '@/renderer/components/layouts/sidebars/sidebar';
import { LayoutContext } from '@/renderer/contexts/layout';
import { useLayoutState } from '@/renderer/hooks/user-layout-state';
@@ -106,7 +107,7 @@ export const Layout = () => {
/>
</div>
)}
{shouldDisplayRight && (
{shouldDisplayLeft && shouldDisplayRight && (
<Resizable
as="div"
className="h-full max-h-full min-h-full overflow-hidden border-l border-gray-200 bg-white"
@@ -147,6 +148,7 @@ export const Layout = () => {
/>
</Resizable>
)}
{!shouldDisplayLeft && !shouldDisplayRight && <ContainerBlank />}
</div>
</LayoutContext.Provider>
);

View File

@@ -21,9 +21,11 @@ export const SidebarChats = () => {
return (
<div className="flex flex-col group/sidebar-chats h-full px-2">
<div className="flex items-center justify-between h-12 pl-2 pr-1">
<p className="font-bold text-muted-foreground flex-grow">Chats</p>
<div className="text-muted-foreground opacity-0 transition-opacity group-hover/sidebar-chats:opacity-100 flex items-center justify-center">
<div className="flex items-center justify-between h-12 pl-2 pr-1 app-drag-region">
<p className="font-bold text-muted-foreground flex-grow app-no-drag-region">
Chats
</p>
<div className="text-muted-foreground opacity-0 transition-opacity group-hover/sidebar-chats:opacity-100 flex items-center justify-center app-no-drag-region">
<ChatCreatePopover />
</div>
</div>

View File

@@ -21,10 +21,12 @@ export const SidebarSpaces = () => {
return (
<div className="flex flex-col group/sidebar-spaces h-full px-2">
<div className="flex items-center justify-between h-12 pl-2 pr-1">
<p className="font-bold text-muted-foreground flex-grow">Spaces</p>
<div className="flex items-center justify-between h-12 pl-2 pr-1 app-drag-region">
<p className="font-bold text-muted-foreground flex-grow app-no-drag-region">
Spaces
</p>
{canCreateSpace && (
<div className="text-muted-foreground opacity-0 transition-opacity group-hover/sidebar-spaces:opacity-100 flex items-center justify-center">
<div className="text-muted-foreground opacity-0 transition-opacity group-hover/sidebar-spaces:opacity-100 flex items-center justify-center app-no-drag-region">
<SpaceCreateButton />
</div>
)}