jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

refactor: Improve HeaderButtons state sync with userData (#8988)

Browse source 
📝 (header-buttons.tsx): Add useEffect hook to update state variables based on userData changes
🔧 (header-buttons.tsx): Refactor useState calls to initialize state variables with userData values and update them on userData changes using useEffect
This commit is contained in:
Cristhian Zanforlin Lousa 2025-07-11 11:24:20 -03:00 • committed by GitHub
commit f8b7be604d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 20 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

27
src/frontend/src/components/core/folderSidebarComponent/components/sideBarFolderButtons/components/header-buttons.tsx
View file

@ -5,7 +5,7 @@ import { useUpdateUser } from "@/controllers/API/queries/auth";
import CustomGetStartedProgress from "@/customization/components/custom-get-started-progress"; import CustomGetStartedProgress from "@/customization/components/custom-get-started-progress";
import useAuthStore from "@/stores/authStore"; import useAuthStore from "@/stores/authStore";
import { Separator } from "@radix-ui/react-separator"; import { Separator } from "@radix-ui/react-separator";
import { useState } from "react"; import { useEffect, useState } from "react";
import { AddFolderButton } from "./add-folder-button"; import { AddFolderButton } from "./add-folder-button";
import { UploadFolderButton } from "./upload-folder-button"; import { UploadFolderButton } from "./upload-folder-button";
@ -21,14 +21,27 @@ export const HeaderButtons = ({
addNewFolder: () => void; addNewFolder: () => void;
}) => { }) => {
const userData = useAuthStore((state) => state.userData); const userData = useAuthStore((state) => state.userData);
const userDismissedDialog = userData?.optins?.dialog_dismissed;
const isGithubStarred = userData?.optins?.github_starred; const [isDismissedDialog, setIsDismissedDialog] = useState(
const isDiscordJoined = userData?.optins?.discord_clicked; userData?.optins?.dialog_dismissed,
const [isDismissedDialog, setIsDismissedDialog] = );
useState(userDismissedDialog); const [isGithubStarred, setIsGithubStarred] = useState(
userData?.optins?.github_starred,
);
const [isDiscordJoined, setIsDiscordJoined] = useState(
userData?.optins?.discord_clicked,
);
const { mutate: updateUser } = useUpdateUser(); const { mutate: updateUser } = useUpdateUser();
useEffect(() => {
if (userData) {
setIsDismissedDialog(userData.optins?.dialog_dismissed);
setIsGithubStarred(userData.optins?.github_starred);
setIsDiscordJoined(userData.optins?.discord_clicked);
}
}, [userData]);
const handleDismissDialog = () => { const handleDismissDialog = () => {
setIsDismissedDialog(true); setIsDismissedDialog(true);
updateUser({ updateUser({
@ -44,7 +57,7 @@ export const HeaderButtons = ({
return ( return (
<> <>
{!isDismissedDialog && ( {!isDismissedDialog && userData && (
<> <>
<CustomGetStartedProgress <CustomGetStartedProgress
userData={userData!} userData={userData!}