refactor(routes): convert to TS

This commit is contained in:
Danny Avila 2023-08-18 12:04:29 -04:00 committed by Danny Avila
parent d612cfcb45
commit 8b4d3c2c21
3 changed files with 21 additions and 13 deletions

View file

@ -1,11 +1,11 @@
import { useState, useEffect } from 'react'; import { useState, useEffect } from 'react';
import { useAuthContext } from '~/hooks/AuthContext'; import { useAuthContext } from '~/hooks';
import { useNavigate, useParams } from 'react-router-dom'; import { useNavigate, useParams } from 'react-router-dom';
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'; import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil';
import Landing from '../components/ui/Landing'; import Landing from '~/components/ui/Landing';
import Messages from '../components/Messages'; import Messages from '~/components/Messages';
import TextChat from '../components/Input/TextChat'; import TextChat from '~/components/Input/TextChat';
import store from '~/store'; import store from '~/store';
import { import {
@ -27,12 +27,12 @@ export default function Chat() {
const navigate = useNavigate(); const navigate = useNavigate();
//disabled by default, we only enable it when messagesTree is null //disabled by default, we only enable it when messagesTree is null
const messagesQuery = useGetMessagesByConvoId(conversationId, { enabled: false }); const messagesQuery = useGetMessagesByConvoId(conversationId ?? '', { enabled: false });
const getConversationMutation = useGetConversationByIdMutation(conversationId); const getConversationMutation = useGetConversationByIdMutation(conversationId ?? '');
const { data: config } = useGetStartupConfig(); const { data: config } = useGetStartupConfig();
useEffect(() => { useEffect(() => {
let timeout = setTimeout(() => { const timeout = setTimeout(() => {
if (!isAuthenticated) { if (!isAuthenticated) {
navigate('/login', { replace: true }); navigate('/login', { replace: true });
} }
@ -97,11 +97,12 @@ export default function Chat() {
} }
} }
document.title = conversation?.title || config?.appTitle || 'Chat'; document.title = conversation?.title || config?.appTitle || 'Chat';
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [conversation, conversationId, config]); }, [conversation, conversationId, config]);
useEffect(() => { useEffect(() => {
if (messagesTree === null && conversation?.conversationId) { if (messagesTree === null && conversation?.conversationId) {
messagesQuery.refetch(conversation?.conversationId); messagesQuery.refetch({ queryKey: [conversation?.conversationId] });
} }
}, [conversation?.conversationId, messagesQuery, messagesTree]); }, [conversation?.conversationId, messagesQuery, messagesTree]);
@ -113,6 +114,7 @@ export default function Chat() {
console.error(messagesQuery.error); console.error(messagesQuery.error);
setMessages(null); setMessages(null);
} }
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [messagesQuery.data, messagesQuery.isError, setMessages]); }, [messagesQuery.data, messagesQuery.isError, setMessages]);
if (!isAuthenticated) { if (!isAuthenticated) {

View file

@ -2,8 +2,8 @@ import React, { useEffect } from 'react';
import { useNavigate, useParams } from 'react-router-dom'; import { useNavigate, useParams } from 'react-router-dom';
import { useRecoilState, useRecoilValue } from 'recoil'; import { useRecoilState, useRecoilValue } from 'recoil';
import Messages from '../components/Messages'; import Messages from '~/components/Messages';
import TextChat from '../components/Input/TextChat'; import TextChat from '~/components/Input/TextChat';
import store from '~/store'; import store from '~/store';
@ -34,6 +34,7 @@ export default function Search() {
// conversationId (in url) should always follow conversation?.conversationId, unless conversation is null // conversationId (in url) should always follow conversation?.conversationId, unless conversation is null
navigate(`/chat/${conversation?.conversationId}`); navigate(`/chat/${conversation?.conversationId}`);
} }
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [conversation, query, searchQuery]); }, [conversation, query, searchQuery]);
// if not a search // if not a search

View file

@ -2,9 +2,14 @@ import { createBrowserRouter, Navigate, Outlet } from 'react-router-dom';
import Root from './Root'; import Root from './Root';
import Chat from './Chat'; import Chat from './Chat';
import Search from './Search'; import Search from './Search';
import { Login, Registration, RequestPasswordReset, ResetPassword } from '../components/Auth'; import {
import { AuthContextProvider } from '../hooks/AuthContext'; Login,
import ApiErrorWatcher from '../components/Auth/ApiErrorWatcher'; Registration,
RequestPasswordReset,
ResetPassword,
ApiErrorWatcher,
} from '~/components/Auth';
import { AuthContextProvider } from '~/hooks/AuthContext';
const AuthLayout = () => ( const AuthLayout = () => (
<AuthContextProvider> <AuthContextProvider>