diff --git a/package.json b/package.json index 309e53c..9c48357 100644 --- a/package.json +++ b/package.json @@ -10,10 +10,13 @@ }, "dependencies": { "clsx": "^2.1.1", + "framer-motion": "^12.4.7", "motion": "^12.4.5", "next": "15.1.7", "react": "^19.0.0", "react-dom": "^19.0.0", + "react-toastify": "^11.0.5", + "react-tweet": "^3.2.2", "tailwind-merge": "^3.0.1" }, "devDependencies": { diff --git a/src/app/dashboard/chat/2/page.tsx b/src/app/dashboard/chat/2/page.tsx index e55330b..ce113f4 100644 --- a/src/app/dashboard/chat/2/page.tsx +++ b/src/app/dashboard/chat/2/page.tsx @@ -1,14 +1,26 @@ "use client"; -import { useState } from "react"; +import { useEffect, useState } from "react"; import Image from "next/image"; import avatarImg1 from "@/assets/images/avatars/1.svg"; import Types from "../../Types"; import Sidebar from "@/components/Sidebar"; import { motion } from "motion/react"; +import Loader from "@/components/Loader"; export default function DashboardChat() { + const [state, setState] = useState(1); const [isOpen, setIsOpen] = useState(true); + useEffect(() => { + setTimeout(() => { + setState(2); + + setTimeout(() => { + setState(3); + }, 2000); + }, 3000); + }, []); + return (
@@ -46,196 +58,200 @@ export default function DashboardChat() { nisi ut aliquip ex ea commodo consequat. - - + -
-

- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed - do eiusmod tempor incididunt ut labore et dolore magna aliqua. - Ut enim ad minim veniam, quis nostrud exercitation ullamco - laboris nisi ut aliquip ex ea commodo consequat. -

+ {state === 3 && ( + + -
-
{ - setIsOpen(!isOpen); - }} - className="flex justify-between items-center cursor-pointer" - > -
+
+

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed + do eiusmod tempor incididunt ut labore et dolore magna + aliqua. Ut enim ad minim veniam, quis nostrud exercitation + ullamco laboris nisi ut aliquip ex ea commodo consequat. +

+ +
+
{ + setIsOpen(!isOpen); + }} + className="flex justify-between items-center cursor-pointer" + > +
+ + + + +
+

+ Title of the Dropdown appears in this section +

+

+ Collapse Details +

+
+
+ + +
+ + {isOpen && ( +

+ Lorem ipsum odor amet, consectetuer adipiscing elit. + Eros platea molestie taciti amet class at dictum est. + Conubia pharetra maecenas iaculis dui litora convallis + et nostra leo. Pellentesque justo sapien amet rhoncus + aliquet torquent. Netus lobortis justo eleifend auctor + nunc. Vel ex montes commodo, sodales ex iaculis? Dictum + habitant duis nam; ridiculus gravida eleifend montes + dignissim nam.
+
+ Nam fermentum id sociosqu curae lacinia felis. Nisl ac + cursus inceptos suscipit eros. Accumsan class vitae + pulvinar suscipit aliquet? Senectus semper feugiat + lobortis morbi vitae tempor. Faucibus nibh posuere + blandit himenaeos curabitur. Mauris tortor lorem id + magnis tellus senectus laoreet. Magnis elit hendrerit + litora in faucibus pharetra. Justo dui ultricies commodo + tempus, mauris eleifend nascetur.
+
+ Ligula tempus purus nec congue, tellus hendrerit litora. + Nostra morbi natoque massa metus; bibendum tempus + malesuada. Fames donec ultricies metus; condimentum + feugiat tristique elementum. Nullam maecenas primis + bibendum eleifend hac viverra libero. Proin velit montes + netus lacus ante ornare porttitor justo. Quam lorem + volutpat accumsan, tristique proin at parturient. + Condimentum eu risus tincidunt pulvinar consequat + natoque. Vulputate sagittis quis ad tempor lobortis + ultrices dolor gravida? Tincidunt tempor rhoncus massa + fermentum faucibus fermentum nullam pretium. Diam + habitant ex maximus odio praesent semper ipsum ex. +

+ )} +
+ +
+ + + -
-

- Title of the Dropdown appears in this section -

-

- Collapse Details -

-
-
- - + +
- - {isOpen && ( -

- Lorem ipsum odor amet, consectetuer adipiscing elit. Eros - platea molestie taciti amet class at dictum est. Conubia - pharetra maecenas iaculis dui litora convallis et nostra - leo. Pellentesque justo sapien amet rhoncus aliquet - torquent. Netus lobortis justo eleifend auctor nunc. Vel - ex montes commodo, sodales ex iaculis? Dictum habitant - duis nam; ridiculus gravida eleifend montes dignissim nam.{" "} -
-
- Nam fermentum id sociosqu curae lacinia felis. Nisl ac - cursus inceptos suscipit eros. Accumsan class vitae - pulvinar suscipit aliquet? Senectus semper feugiat - lobortis morbi vitae tempor. Faucibus nibh posuere blandit - himenaeos curabitur. Mauris tortor lorem id magnis tellus - senectus laoreet. Magnis elit hendrerit litora in faucibus - pharetra. Justo dui ultricies commodo tempus, mauris - eleifend nascetur.
-
- Ligula tempus purus nec congue, tellus hendrerit litora. - Nostra morbi natoque massa metus; bibendum tempus - malesuada. Fames donec ultricies metus; condimentum - feugiat tristique elementum. Nullam maecenas primis - bibendum eleifend hac viverra libero. Proin velit montes - netus lacus ante ornare porttitor justo. Quam lorem - volutpat accumsan, tristique proin at parturient. - Condimentum eu risus tincidunt pulvinar consequat natoque. - Vulputate sagittis quis ad tempor lobortis ultrices dolor - gravida? Tincidunt tempor rhoncus massa fermentum faucibus - fermentum nullam pretium. Diam habitant ex maximus odio - praesent semper ipsum ex. -

- )}
- -
- - - - - - - -
-
- + + )}
(1); + + useEffect(() => { + setTimeout(() => { + setState(2); + + setTimeout(() => { + setState(3); + }, 2000); + }, 3000); + }, []); + return (
@@ -43,246 +57,253 @@ export default function DashboardChat() { nisi ut aliquip ex ea commodo consequat. - - + -
-
-
-
- - - + {state === 3 && ( + + -
-

DeepSearch

-

- 21s * 24 sources -

-
-
- -
- - - - - - - -
-

Researching

-

topic name here

-
-
- -
- - - - - - - -
-

- Exploring research -

-

papers

-
-
- -
- - - - - -
-

Complete

-
-
-
- -

- Lorem ipsum odor amet, consectetuer adipiscing elit. Eros - platea molestie taciti amet class at dictum est. Conubia - pharetra maecenas iaculis dui litora convallis et nostra - leo. Pellentesque justo sapien amet rhoncus aliquet - torquent. Netus lobortis justo eleifend auctor nunc. Vel ex - montes commodo, sodales ex iaculis? Dictum habitant duis - nam; ridiculus gravida eleifend montes dignissim nam.
-
- Nam fermentum id sociosqu curae lacinia felis. Nisl ac - cursus inceptos suscipit eros. Accumsan class vitae pulvinar - suscipit aliquet? Senectus semper feugiat lobortis morbi - vitae tempor. Faucibus nibh posuere blandit himenaeos - curabitur. Mauris tortor lorem id magnis tellus senectus - laoreet. Magnis elit hendrerit litora in faucibus pharetra. - Justo dui ultricies commodo tempus, mauris eleifend - nascetur.
-
- Diam habitant ex maximus odio praesent semper ipsum ex. -

-
- -
-
- - - - - - - - - -

24 web pages

-
- -
- + + + + - + - - - + +
-
- + + )}
(1); + + useEffect(() => { + setTimeout(() => { + setState(2); + + setTimeout(() => { + setState(3); + }, 2000); + }, 3000); + }, []); + + return ( +
+
+ + +
+
+ + Title of the Chat comes in this section + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do + eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut + enim ad minim veniam, quis nostrud exercitation ullamco laboris + nisi ut aliquip ex ea commodo consequat. + + + + + {state === 3 && ( + + + +
+
+
+

+ Token Chart +

+ + +
+ +
+
+ + + + + + + + + + + + + + + +
+

Token Name

+ +

+ Token Symbol +

+
+
+ +

+ + + + + + + + + + + + + + + CA : 0x1231....abcd{" "} + { + toast.success("Copied!"); + + navigator.clipboard.writeText("0x1231....abcd"); + }} + width="17" + height="16" + viewBox="0 0 17 16" + fill="none" + xmlns="http://www.w3.org/2000/svg" + className="cursor-pointer" + > + + +

+
+ +