chore: update routes

This commit is contained in:
steven
2023-03-22 10:24:03 +08:00
parent 7187b9c027
commit 90a6fec65c
5 changed files with 46 additions and 51 deletions

View File

@ -24,16 +24,16 @@ const Header = () => {
</Menu.Button> </Menu.Button>
<Menu.Items className="absolute left-0 top-full mt-1 w-32 origin-top-right rounded-lg bg-white shadow-lg ring-1 ring-black ring-opacity-5 outline-none p-1 space-y-1"> <Menu.Items className="absolute left-0 top-full mt-1 w-32 origin-top-right rounded-lg bg-white shadow-lg ring-1 ring-black ring-opacity-5 outline-none p-1 space-y-1">
<Menu.Item> <Menu.Item>
<Link className="w-full p-2 rounded-lg flex flex-row justify-start items-center hover:bg-gray-100" href="/"> <Link className="w-full p-2 rounded-lg flex flex-row justify-start items-center hover:bg-gray-100" href="/about">
<Icon.Io.IoMdHome className="text-gray-600 w-5 h-auto mr-1" /> <Icon.Io.IoMdInformationCircleOutline className="text-gray-600 w-5 h-auto mr-1" />
Home About
</Link> </Link>
</Menu.Item> </Menu.Item>
<Menu.Item> <Menu.Item>
<a <a
className="w-full p-2 rounded-lg flex flex-row justify-start items-center hover:bg-gray-100"
href="https://github.com/bytebase/sqlchat" href="https://github.com/bytebase/sqlchat"
target="_blank" target="_blank"
className="w-full p-2 rounded-lg flex flex-row justify-start items-center hover:bg-gray-100"
> >
<Icon.Io.IoLogoGithub className="text-gray-600 w-5 h-auto mr-1" /> GitHub <Icon.Io.IoLogoGithub className="text-gray-600 w-5 h-auto mr-1" /> GitHub
</a> </a>

View File

@ -70,10 +70,7 @@ const ChatView = () => {
}; };
return ( return (
<main <main ref={chatViewRef} className="relative w-full h-full max-h-full flex flex-col justify-start items-start overflow-y-auto bg-white">
ref={chatViewRef}
className="relative sm:border sm:rounded-lg sm:shadow w-full mx-auto h-full max-h-full flex flex-col justify-start items-start overflow-y-auto bg-white"
>
<Header /> <Header />
<div className="p-2 w-full h-auto grow max-w-3xl py-1 px-4 sm:px-8 mx-auto"> <div className="p-2 w-full h-auto grow max-w-3xl py-1 px-4 sm:px-8 mx-auto">
{messageList.length === 0 ? <></> : messageList.map((message) => <MessageView key={message.id} message={message} />)} {messageList.length === 0 ? <></> : messageList.map((message) => <MessageView key={message.id} message={message} />)}

34
pages/about.tsx Normal file
View File

@ -0,0 +1,34 @@
import { NextPage } from "next";
import Head from "next/head";
import Link from "next/link";
import React from "react";
import Icon from "../components/Icon";
const HomePage: NextPage = () => {
return (
<>
<Head>
<title>SQL Chat</title>
<meta name="description" content="" />
<link rel="icon" href="/favicon.ico" />
</Head>
<main className="w-full h-full flex flex-col items-center justify-center">
<div className="flex flex-col items-center justify-center px-4 py-16">
<h1 className="text-5xl font-extrabold text-gray-800 sm:text-6xl">SQL Chat</h1>
<div className="grid grid-cols-1 mt-8">
<Link
className="flex max-w-xs flex-row justify-center items-center rounded-xl bg-indigo-600 p-4 px-6 text-white shadow-lg hover:opacity-80"
href="/chat"
>
<Icon.Io.IoIosChatbubbles className="w-6 h-auto mr-2" />
<span className="text-xl font-medium">Chat </span>
</Link>
</div>
</div>
</main>
</>
);
};
export default HomePage;

View File

@ -1,24 +0,0 @@
import { NextPage } from "next";
import Head from "next/head";
import React from "react";
import ChatView from "../components/ChatView";
const ChatPage: NextPage = () => {
return (
<div>
<Head>
<title>SQL Chat</title>
<meta name="description" content="" />
<link rel="icon" href="/favicon.ico" />
</Head>
<main className="w-full h-full flex flex-col justify-center items-center bg-gray-100">
<div className="w-full h-full md:w-4/5 md:max-w-4xl md:h-5/6">
<ChatView />
</div>
</main>
</div>
);
};
export default ChatPage;

View File

@ -1,34 +1,22 @@
import { NextPage } from "next"; import { NextPage } from "next";
import Head from "next/head"; import Head from "next/head";
import Link from "next/link";
import React from "react"; import React from "react";
import Icon from "../components/Icon"; import ChatView from "../components/ChatView";
const HomePage: NextPage = () => { const ChatPage: NextPage = () => {
return ( return (
<> <div>
<Head> <Head>
<title>SQL Chat</title> <title>SQL Chat</title>
<meta name="description" content="" /> <meta name="description" content="" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
</Head> </Head>
<main className="w-full h-full flex flex-col items-center justify-center"> <main className="w-full h-full flex flex-col justify-center items-center bg-gray-100">
<div className="flex flex-col items-center justify-center px-4 py-16"> <ChatView />
<h1 className="text-5xl font-extrabold text-gray-800 sm:text-6xl">SQL Chat</h1>
<div className="grid grid-cols-1 mt-8">
<Link
className="flex max-w-xs flex-row justify-center items-center rounded-xl bg-indigo-600 p-4 px-6 text-white shadow-lg hover:opacity-80"
href="/chat"
>
<Icon.Io.IoIosChatbubbles className="w-6 h-auto mr-2" />
<span className="text-xl font-medium">Chat </span>
</Link>
</div>
</div>
</main> </main>
</> </div>
); );
}; };
export default HomePage; export default ChatPage;