diff --git a/frontend/src/menuAside.ts b/frontend/src/menuAside.ts index bfe66ca..4ab274d 100644 --- a/frontend/src/menuAside.ts +++ b/frontend/src/menuAside.ts @@ -7,7 +7,11 @@ const menuAside: MenuAsideItem[] = [ icon: icon.mdiViewDashboardOutline, label: 'Dashboard', }, - + { + href: '/scenes/akaza-roleplay', + label: 'Akaza Roleplay', + icon: icon.mdiChatOutline, + }, { href: '/users/users-list', label: 'Users', @@ -104,4 +108,4 @@ const menuAside: MenuAsideItem[] = [ }, ] -export default menuAside +export default menuAside \ No newline at end of file diff --git a/frontend/src/pages/scenes/akaza-roleplay.tsx b/frontend/src/pages/scenes/akaza-roleplay.tsx new file mode 100644 index 0000000..6ca40ee --- /dev/null +++ b/frontend/src/pages/scenes/akaza-roleplay.tsx @@ -0,0 +1,67 @@ +import { mdiChatOutline } from '@mdi/js'; +import Head from 'next/head'; +import React, { ReactElement, useEffect, useState } from 'react'; +import { useRouter } from 'next/router'; +import CardBox from '../../components/CardBox'; +import LayoutAuthenticated from '../../layouts/Authenticated'; +import SectionMain from '../../components/SectionMain'; +import SectionTitleLineWithButton from '../../components/SectionTitleLineWithButton'; +import BaseButton from '../../components/BaseButton'; +import { useAppDispatch, useAppSelector } from '../../stores/hooks'; +import { fetch } from '../../stores/scenes/scenesSlice'; +import { getPageTitle } from '../../config'; +import LoadingSpinner from '../../components/LoadingSpinner'; + +const AkazaRoleplay = () => { + const router = useRouter(); + const dispatch = useAppDispatch(); + const { scenesId } = router.query; + const { scenes, loading } = useAppSelector((state) => state.scenes); + + useEffect(() => { + if (scenesId) { + dispatch(fetch({ id: scenesId })); + } + }, [scenesId, dispatch]); + + return ( + <> + + {getPageTitle('Akaza Roleplay')} + + + + router.push('/scenes/scenes-list')} /> + + + {loading ? ( + + ) : ( +
+

{scenes?.title || 'Loading Scene...'}

+
+ +
+

Conversation

+
+ {/* Chat messages will appear here */} +

Chat history will be loaded here...

+
+
+ + +
+
+
+ )} + + + + ); +}; + +AkazaRoleplay.getLayout = function getLayout(page: ReactElement) { + return {page}; +}; + +export default AkazaRoleplay;