Skip to content

Commit ca9a4cd

Browse files
kartikpersistentkartikpersistent
committed
fix: hooks order mismatch
1 parent 8f08e41 commit ca9a4cd

File tree

1 file changed

+68
-67
lines changed

1 file changed

+68
-67
lines changed

‎frontend/src/components/Layout/PageLayout.tsx‎

Lines changed: 68 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -14,19 +14,20 @@ import useSpeechSynthesis from '../../hooks/useSpeech';
1414
import FallBackDialog from '../UI/FallBackDialog';
1515
import { envConnectionAPI } from '../../services/ConnectAPI';
1616
import { healthStatus } from '../../services/HealthStatus';
17-
import { useNavigate } from 'react-router';
1817
import { useAuth0 } from '@auth0/auth0-react';
1918
import { showErrorToast } from '../../utils/Toasts';
2019
import { APP_SOURCES } from '../../utils/Constants';
2120
import { createDefaultFormData } from '../../API/Index';
2221
import LoadExistingSchemaDialog from '../Popups/GraphEnhancementDialog/EnitityExtraction/LoadExistingSchema';
2322
import PredefinedSchemaDialog from '../Popups/GraphEnhancementDialog/EnitityExtraction/PredefinedSchemaDialog';
23+
import { SKIP_AUTH } from '../../utils/Constants';
24+
import { useNavigate } from 'react-router';
2425

2526
const GCSModal = lazy(() => import('../DataSources/GCS/GCSModal'));
2627
const S3Modal = lazy(() => import('../DataSources/AWS/S3Modal'));
2728
const GenericModal = lazy(() => import('../WebSources/GenericSourceModal'));
2829
const ConnectionModal = lazy(() => import('../Popups/ConnectionModal/ConnectionModal'));
29-
import { SKIP_AUTH } from '../../utils/Constants';
30+
3031
const spotlightsforunauthenticated = [
3132
{
3233
target: 'loginbutton',
@@ -90,6 +91,7 @@ const spotlightsforunauthenticated = [
9091
),
9192
},
9293
];
94+
9395
const spotlights = [
9496
{
9597
target: 'connectbutton',
@@ -144,6 +146,7 @@ const spotlights = [
144146
),
145147
},
146148
];
149+
147150
const PageLayout: React.FC = () => {
148151
const [openConnection, setOpenConnection] = useState<connectionState>({
149152
openPopUp: false,
@@ -152,6 +155,14 @@ const PageLayout: React.FC = () => {
152155
chunksExistsWithDifferentDimension: false,
153156
});
154157
const isLargeDesktop = useMediaQuery(`(min-width:1440px )`);
158+
const [isLeftExpanded, setIsLeftExpanded] = useState<boolean>(false);
159+
const [isRightExpanded, setIsRightExpanded] = useState<boolean>(false);
160+
const [showChatBot, setShowChatBot] = useState<boolean>(false);
161+
const [showDrawerChatbot, setShowDrawerChatbot] = useState<boolean>(true);
162+
const [showEnhancementDialog, toggleEnhancementDialog] = useReducer((s) => !s, false);
163+
const [shows3Modal, toggleS3Modal] = useReducer((s) => !s, false);
164+
const [showGCSModal, toggleGCSModal] = useReducer((s) => !s, false);
165+
const [showGenericModal, toggleGenericModal] = useReducer((s) => !s, false);
155166
const {
156167
connectionStatus,
157168
setIsReadOnlyUser,
@@ -164,47 +175,6 @@ const PageLayout: React.FC = () => {
164175
showDisconnectButton,
165176
setIsGCSActive,
166177
} = useCredentials();
167-
const [isLeftExpanded, setIsLeftExpanded] = useState<boolean>(Boolean(isLargeDesktop));
168-
const [isRightExpanded, setIsRightExpanded] = useState<boolean>(Boolean(isLargeDesktop));
169-
const [showChatBot, setShowChatBot] = useState<boolean>(false);
170-
const [showDrawerChatbot, setShowDrawerChatbot] = useState<boolean>(true);
171-
const [showEnhancementDialog, toggleEnhancementDialog] = useReducer((s) => !s, false);
172-
const [shows3Modal, toggleS3Modal] = useReducer((s) => !s, false);
173-
const [showGCSModal, toggleGCSModal] = useReducer((s) => {
174-
return !s;
175-
}, false);
176-
const [showGenericModal, toggleGenericModal] = useReducer((s) => !s, false);
177-
const { user, isAuthenticated } = useAuth0();
178-
179-
const navigate = useNavigate();
180-
181-
const toggleLeftDrawer = useCallback(() => {
182-
if (isLargeDesktop) {
183-
setIsLeftExpanded(!isLeftExpanded);
184-
} else {
185-
setIsLeftExpanded(false);
186-
}
187-
}, [isLargeDesktop]);
188-
const toggleRightDrawer = useCallback(() => {
189-
if (isLargeDesktop) {
190-
setIsRightExpanded(!isRightExpanded);
191-
} else {
192-
setIsRightExpanded(false);
193-
}
194-
}, [isLargeDesktop]);
195-
const isYoutubeOnly = useMemo(
196-
() => APP_SOURCES.includes('youtube') && !APP_SOURCES.includes('wiki') && !APP_SOURCES.includes('web'),
197-
[]
198-
);
199-
const isWikipediaOnly = useMemo(
200-
() => APP_SOURCES.includes('wiki') && !APP_SOURCES.includes('youtube') && !APP_SOURCES.includes('web'),
201-
[]
202-
);
203-
const isWebOnly = useMemo(
204-
() => APP_SOURCES.includes('web') && !APP_SOURCES.includes('youtube') && !APP_SOURCES.includes('wiki'),
205-
[]
206-
);
207-
const { messages, setClearHistoryData, clearHistoryData, setMessages, setIsDeleteChatLoading } = useMessageContext();
208178
const {
209179
setShowTextFromSchemaDialog,
210180
showTextFromSchemaDialog,
@@ -223,11 +193,25 @@ const PageLayout: React.FC = () => {
223193
setPreDefinedRels,
224194
setPreDefinedPattern,
225195
} = useFileContext();
196+
const navigate = useNavigate();
197+
const { user, isAuthenticated } = useAuth0();
226198
const { cancel } = useSpeechSynthesis();
227199
const { setActiveSpotlight } = useSpotlightContext();
228-
const isFirstTimeUser = useMemo(() => {
229-
return localStorage.getItem('neo4j.connection') === null;
230-
}, []);
200+
const isYoutubeOnly = useMemo(
201+
() => APP_SOURCES.includes('youtube') && !APP_SOURCES.includes('wiki') && !APP_SOURCES.includes('web'),
202+
[]
203+
);
204+
const isWikipediaOnly = useMemo(
205+
() => APP_SOURCES.includes('wiki') && !APP_SOURCES.includes('youtube') && !APP_SOURCES.includes('web'),
206+
[]
207+
);
208+
const isWebOnly = useMemo(
209+
() => APP_SOURCES.includes('web') && !APP_SOURCES.includes('youtube') && !APP_SOURCES.includes('wiki'),
210+
[]
211+
);
212+
const { messages, setClearHistoryData, clearHistoryData, setMessages, setIsDeleteChatLoading } = useMessageContext();
213+
const isFirstTimeUser = useMemo(() => localStorage.getItem('neo4j.connection') === null, []);
214+
231215
useEffect(() => {
232216
async function initializeConnection() {
233217
// Fetch backend health status
@@ -271,7 +255,7 @@ const PageLayout: React.FC = () => {
271255
uri: credentials.uri,
272256
database: credentials.database,
273257
userName: credentials.userName,
274-
password: atob(credentials.password),
258+
password: atob(credentials?.password),
275259
email: credentials.email ?? '',
276260
});
277261
setIsGCSActive(credentials.isGCSActive);
@@ -305,6 +289,21 @@ const PageLayout: React.FC = () => {
305289
}
306290
}, [isAuthenticated]);
307291

292+
const toggleLeftDrawer = useCallback(() => {
293+
if (isLargeDesktop) {
294+
setIsLeftExpanded(!isLeftExpanded);
295+
} else {
296+
setIsLeftExpanded(false);
297+
}
298+
}, [isLargeDesktop]);
299+
const toggleRightDrawer = useCallback(() => {
300+
if (isLargeDesktop) {
301+
setIsRightExpanded(!isRightExpanded);
302+
} else {
303+
setIsRightExpanded(false);
304+
}
305+
}, [isLargeDesktop]);
306+
308307
const deleteOnClick = useCallback(async () => {
309308
try {
310309
setClearHistoryData(true);
@@ -379,6 +378,20 @@ const PageLayout: React.FC = () => {
379378
setPreDefinedRels(rels);
380379
}, []);
381380

381+
const openPredefinedSchema = useCallback(() => {
382+
setPredefinedSchemaDialog({ triggeredFrom: 'predefinedDialog', show: true });
383+
}, []);
384+
385+
const openLoadSchema = useCallback(() => {
386+
setSchemaLoadDialog({ triggeredFrom: 'loadDialog', show: true });
387+
}, []);
388+
389+
const openTextSchema = useCallback(() => {
390+
setShowTextFromSchemaDialog({ triggeredFrom: 'schemadialog', show: true });
391+
}, []);
392+
393+
const openChatBot = useCallback(() => setShowChatBot(true), []);
394+
382395
return (
383396
<>
384397
{!isAuthenticated && !SKIP_AUTH && isFirstTimeUser ? (
@@ -491,17 +504,11 @@ const PageLayout: React.FC = () => {
491504
/>
492505
)}
493506
<Content
494-
openChatBot={useCallback(() => setShowChatBot(true), [])}
507+
openChatBot={openChatBot}
495508
showChatBot={showChatBot}
496-
openTextSchema={useCallback(() => {
497-
setShowTextFromSchemaDialog({ triggeredFrom: 'schemadialog', show: true });
498-
}, [])}
499-
openLoadSchema={useCallback(() => {
500-
setSchemaLoadDialog({ triggeredFrom: 'loadDialog', show: true });
501-
}, [])}
502-
openPredefinedSchema={useCallback(() => {
503-
setPredefinedSchemaDialog({ triggeredFrom: 'predefinedDialog', show: true });
504-
}, [])}
509+
openTextSchema={openTextSchema}
510+
openLoadSchema={openLoadSchema}
511+
openPredefinedSchema={openPredefinedSchema}
505512
showEnhancementDialog={showEnhancementDialog}
506513
toggleEnhancementDialog={toggleEnhancementDialog}
507514
setOpenConnection={setOpenConnection}
@@ -560,17 +567,11 @@ const PageLayout: React.FC = () => {
560567
/>
561568

562569
<Content
563-
openChatBot={() => setShowChatBot(true)}
570+
openChatBot={openChatBot}
564571
showChatBot={showChatBot}
565-
openTextSchema={useCallback(() => {
566-
setShowTextFromSchemaDialog({ triggeredFrom: 'schemaDialog', show: true });
567-
}, [])}
568-
openLoadSchema={useCallback(() => {
569-
setShowTextFromSchemaDialog({ triggeredFrom: 'loadDialog', show: true });
570-
}, [])}
571-
openPredefinedSchema={useCallback(() => {
572-
setPredefinedSchemaDialog({ triggeredFrom: 'prdefinedDialog', show: true });
573-
}, [])}
572+
openTextSchema={openTextSchema}
573+
openLoadSchema={openLoadSchema}
574+
openPredefinedSchema={openPredefinedSchema}
574575
showEnhancementDialog={showEnhancementDialog}
575576
toggleEnhancementDialog={toggleEnhancementDialog}
576577
setOpenConnection={setOpenConnection}

0 commit comments

Comments
 (0)