Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: remove useSidebar to fix errors of SidebarWrapper when opening playground page #4767

Merged
merged 2 commits into from
Nov 22, 2024
Merged

fix: remove useSidebar to fix errors of SidebarWrapper when opening playground page #4767

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c944f2c
Added open to data of wrapper
lucaseduoli Nov 21, 2024
ef374d0
Fix PageComponent and Header to not use useSidebar anymore
lucaseduoli Nov 21, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/frontend/src/components/ui/sidebar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -131,6 +131,7 @@ const SidebarProvider = React.forwardRef<
"group/sidebar-wrapper flex h-full w-full text-foreground has-[[data-variant=inset]]:bg-background",
className,
)}
data-open={open}
ref={ref}
{...props}
>
Expand Down
10 changes: 3 additions & 7 deletions src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import CanvasControls, {
import FlowToolbar from "@/components/flowToolbarComponent";
import ForwardedIconComponent from "@/components/genericIconComponent";
import LoadingComponent from "@/components/loadingComponent";
import { SidebarTrigger, useSidebar } from "@/components/ui/sidebar";
import { SidebarTrigger } from "@/components/ui/sidebar";
import {
COLOR_OPTIONS,
NOTE_NODE_MIN_HEIGHT,
Expand Down Expand Up @@ -504,8 +504,6 @@ export default function Page({ view }: { view?: boolean }): JSX.Element {
reactFlowWrapper.current?.style.setProperty("--selected", accentColor);
};

const { open } = useSidebar();

useEffect(() => {
const handleGlobalMouseMove = (event) => {
if (isAddingNote) {
Expand Down Expand Up @@ -591,9 +589,7 @@ export default function Page({ view }: { view?: boolean }): JSX.Element {
<Panel
className={cn(
"react-flow__controls !m-2 flex gap-1.5 rounded-md border border-secondary-hover bg-background fill-foreground stroke-foreground p-1.5 text-primary shadow transition-all duration-300 [&>button]:border-0 [&>button]:bg-background hover:[&>button]:bg-accent",
open
? "pointer-events-none -translate-x-full opacity-0"
: "pointer-events-auto opacity-100",
"pointer-events-auto opacity-100 group-data-[open=true]/sidebar-wrapper:pointer-events-none group-data-[open=true]/sidebar-wrapper:-translate-x-full group-data-[open=true]/sidebar-wrapper:opacity-0",
)}
position="top-left"
>
Expand All @@ -602,7 +598,7 @@ export default function Page({ view }: { view?: boolean }): JSX.Element {
name="PanelRightClose"
className="h-4 w-4"
/>
Components
<span className="text-foreground">Components</span>
</SidebarTrigger>
</Panel>
<SelectionMenu
Expand Down
15 changes: 3 additions & 12 deletions src/frontend/src/pages/MainPage/components/header/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@ import ForwardedIconComponent from "@/components/genericIconComponent";
import ShadTooltip from "@/components/shadTooltipComponent";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { SidebarTrigger, useSidebar } from "@/components/ui/sidebar";
import { cn } from "@/utils/utils";
import { SidebarTrigger } from "@/components/ui/sidebar";
import { debounce } from "lodash";
import { useCallback, useEffect, useState } from "react";

Expand All @@ -29,7 +28,6 @@ const HeaderComponent = ({
isEmptyFolder,
}: HeaderComponentProps) => {
const [debouncedSearch, setDebouncedSearch] = useState("");
const { open } = useSidebar();

// Debounce the setSearch function from the parent
const debouncedSetSearch = useCallback(
Expand Down Expand Up @@ -57,15 +55,8 @@ const HeaderComponent = ({
className="flex items-center pb-8 text-xl font-semibold"
data-testid="mainpage_title"
>
<div
className={cn("h-7 w-10 transition-all lg:hidden", open && "md:w-0")}
>
<div
className={cn(
"relative left-0 opacity-100 transition-all",
open ? "md:opacity-0" : "",
)}
>
<div className="h-7 w-10 transition-all group-data-[open=true]/sidebar-wrapper:md:w-0 lg:hidden">
<div className="relative left-0 opacity-100 transition-all group-data-[open=true]/sidebar-wrapper:md:opacity-0">
<SidebarTrigger>
<ForwardedIconComponent
name="PanelLeftOpen"
Expand Down
Loading