Skip to content

Commit bf8adce

Browse files
zhangligeizhangligei
authored
✨ feat: Add Xyzen chat landing page with HeroParallax and CTA button (#10)
- ♻️ refactor:Create /chat route with HeroParallax component for product showcase - Add products.ts with Xyzen product data - Implement chat page layout with animated parallax effect - Add CTA button linking to Bohrium Xyzen application - Update Navbar to include Projects menu with 5 ScienceOL products - Add dark mode styling for better visual appearance - Integrate React Router with new /chat route in router.tsx
1 parent 0e0c258 commit bf8adce

File tree

7 files changed

+549
-157
lines changed

7 files changed

+549
-157
lines changed

‎web/src/app/chat/page.tsx‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
'use client';
2+
3+
import { HeroParallax } from '@/components/ui/hero-parallax';
4+
import { products } from './products';
5+
6+
export default function ChatPage() {
7+
return (
8+
<div className="relative w-full">
9+
<HeroParallax products={products} />
10+
11+
<div className="relative bg-black py-16 px-4">
12+
<div className="max-w-7xl mx-auto flex flex-col items-center justify-center gap-8">
13+
<div className="text-center">
14+
<h2 className="text-3xl md:text-4xl font-bold text-white mb-4">
15+
准备好开始了吗？
16+
</h2>
17+
<p className="text-gray-300 text-lg mb-8">
18+
点击下方按钮，立即体验 Xyzen AI Agent
19+
</p>
20+
</div>
21+
22+
<button
23+
onClick={() => {
24+
window.open(
25+
'https://www.bohrium.com/apps/xyzen',
26+
'_blank'
27+
);
28+
}}
29+
className="group relative px-8 py-3 text-lg font-semibold rounded bg-gradient-to-br from-violet-600 to-fuchsia-600 text-white hover:shadow-2xl transition-all duration-300 hover:scale-105"
30+
>
31+
开始使用 Xyzen
32+
</button>
33+
</div>
34+
</div>
35+
</div>
36+
);
37+
}

‎web/src/app/chat/products.ts‎

Lines changed: 95 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,95 @@
1+
export const products = [
2+
{
3+
title: "chat1",
4+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
5+
thumbnail:
6+
"https://storage.sciol.ac.cn/library/docs/chat1.png",
7+
},
8+
{
9+
title: "chat2",
10+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
11+
thumbnail:
12+
"https://storage.sciol.ac.cn/library/docs/chat2.png",
13+
},
14+
{
15+
title: "chat3",
16+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
17+
thumbnail:
18+
"https://storage.sciol.ac.cn/library/docs/chat3.png",
19+
},
20+
21+
{
22+
title: "chat4",
23+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
24+
thumbnail:
25+
"https://storage.sciol.ac.cn/library/docs/chat4.png",
26+
},
27+
{
28+
title: "chat5",
29+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
30+
thumbnail:
31+
"https://storage.sciol.ac.cn/library/docs/chat5.png",
32+
},
33+
{
34+
title: "chat6",
35+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
36+
thumbnail:
37+
"https://storage.sciol.ac.cn/library/docs/chat6.png",
38+
},
39+
40+
{
41+
title: "chat7",
42+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
43+
thumbnail:
44+
"https://storage.sciol.ac.cn/library/docs/chat7.png",
45+
},
46+
{
47+
title: "chat8",
48+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
49+
thumbnail:
50+
"https://storage.sciol.ac.cn/library/docs/chat8.png",
51+
},
52+
{
53+
title: "chat9",
54+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
55+
thumbnail:
56+
"https://storage.sciol.ac.cn/library/docs/chat9.png",
57+
},
58+
{
59+
title: "chat10",
60+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
61+
thumbnail:
62+
"https://storage.sciol.ac.cn/library/docs/chat10.png",
63+
},
64+
{
65+
title: "chat11",
66+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
67+
thumbnail:
68+
"https://storage.sciol.ac.cn/library/docs/chat11.png",
69+
},
70+
71+
{
72+
title: "chat12",
73+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
74+
thumbnail:
75+
"https://storage.sciol.ac.cn/library/docs/chat12.png",
76+
},
77+
{
78+
title: "chat13",
79+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
80+
thumbnail:
81+
"https://storage.sciol.ac.cn/library/docs/chat13.png",
82+
},
83+
{
84+
title: "chat14",
85+
link: "https://www.bohrium.com/apps/xyzen/job?type=app",
86+
thumbnail:
87+
"https://storage.sciol.ac.cn/library/docs/chat14.png",
88+
},
89+
// {
90+
// title: "E Free Invoice",
91+
// link: "https://efreeinvoice.com",
92+
// thumbnail:
93+
// "https://aceternity.com/images/products/thumbnails/new/efreeinvoice.png",
94+
// },
95+
];

‎web/src/app/navbar/Navbar.tsx‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,22 @@
11
'use client';
22
import Logo from '@/assets/Logo';
33

4-
import { useState } from 'react';
4+
import React, { useState } from 'react';
55
import { useTranslation } from 'react-i18next';
66
import About from './About';
77
import Community from './Community';
88
import Projects from './Projects';
99
import { RightSideStatus } from './RightSideStatus';
1010
import Tutorial from './Tutorials';
1111

12+
const TutorialComponent = Tutorial as React.ComponentType<{
13+
index: number;
14+
activeMenuItem: number | null;
15+
setActiveMenuItem: React.Dispatch<React.SetStateAction<number | null>>;
16+
open: boolean;
17+
setOpen: React.Dispatch<React.SetStateAction<boolean>>;
18+
}>;
19+
1220
const NavbarMenu = () => {
1321
const { t } = useTranslation();
1422
const [open, setOpen] = useState(false);
@@ -29,8 +37,7 @@ const NavbarMenu = () => {
2937
open={open}
3038
setOpen={setOpen}
3139
/>
32-
33-
<Tutorial
40+
<TutorialComponent
3441
index={4}
3542
activeMenuItem={activeMenuItem}
3643
setActiveMenuItem={setActiveMenuItem}

0 commit comments

Comments
 (0)