From dec781498e4fa9d8f9618806a738084ea3a59c76 Mon Sep 17 00:00:00 2001 From: THIS ONE IS A LITTLE BIT TRICKY KRUB Date: Fri, 4 Oct 2024 19:43:37 +0700 Subject: [PATCH] change folder name and hierachy --- src/app/invest/1/page.tsx | 144 ------------------ src/app/invest/page.tsx | 299 ++++++++++++++++---------------------- src/app/overview/page.tsx | 191 ++++++++++++++++++++++++ src/app/page.tsx | 2 +- tests/test-2.spec.ts | 26 +++- 5 files changed, 337 insertions(+), 325 deletions(-) delete mode 100644 src/app/invest/1/page.tsx create mode 100644 src/app/overview/page.tsx diff --git a/src/app/invest/1/page.tsx b/src/app/invest/1/page.tsx deleted file mode 100644 index a1a39a1..0000000 --- a/src/app/invest/1/page.tsx +++ /dev/null @@ -1,144 +0,0 @@ -"use client"; - -import { Separator } from "@/components/ui/separator"; -import { Input } from "@/components/ui/input"; -import { CardsPaymentMethod } from "@/components/paymentMethod"; -import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"; -import { Button } from "@/components/ui/button"; -import { useState } from "react"; -import { - Dialog, - DialogContent, - DialogDescription, - DialogHeader, - DialogTitle, - DialogTrigger, - DialogFooter, - DialogClose, -} from "@/components/ui/dialog"; -import { useRouter } from "next/navigation"; -import { toast } from "react-hot-toast"; - -const term_data = [ - { - term: "Minimum Investment", - description: "The minimum investment amount is $500.", - }, - { - term: "Investment Horizon", - description: "Investments are typically locked for a minimum of 12 months.", - }, - { - term: "Fees", - description: "A management fee of 2% will be applied annually.", - }, - { - term: "Returns", - description: "Expected annual returns are between 8% and 12%.", - }, - { - term: "Risk Disclosure", - description: "Investments carry risks, including the loss of principal.", - }, - { - term: "Withdrawal Policy", - description: "Withdrawals can be made after the lock-in period.", - }, -]; - -export default function Invest() { - const [checkedTerms, setCheckedTerms] = useState(Array(term_data.length).fill(false)); - const [error, setError] = useState(""); - const router = useRouter(); // Initialize the router - - const handleCheckboxChange = (index) => { - const updatedCheckedTerms = [...checkedTerms]; - updatedCheckedTerms[index] = !updatedCheckedTerms[index]; - setCheckedTerms(updatedCheckedTerms); - }; - - const handleTermServiceClick = () => { - if (checkedTerms.some((checked) => !checked)) { - setError("Please accept all terms before proceeding with the investment."); - } else { - setError(""); - handleInvestmentSuccess(); - } - }; - - const handleInvestmentSuccess = () => { - toast.success("You successfully invested!"); - - setTimeout(() => { - router.push("/"); - }, 1000); - }; - - return ( -
-

Invest on NVIDIA

- - -
-
-

Investment Amount

- -
- - -
-

Payment Information

- -
- - -
-

Terms and Services

- - - - Select - Term - Description - - - - {term_data.map((item, index) => ( - - - handleCheckboxChange(index)} /> - - {item.term} - {item.description} - - ))} - -
-
- - - - - - - - Are you absolutely sure? - This action cannot be undone. This will permanently! - - - - - - - - {error &&

{error}

} - - -
-
- ); -} diff --git a/src/app/invest/page.tsx b/src/app/invest/page.tsx index 7df681b..80850fd 100644 --- a/src/app/invest/page.tsx +++ b/src/app/invest/page.tsx @@ -1,191 +1,144 @@ "use client"; -import React, { useState, useEffect } from "react"; -import Image from "next/image"; -import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "@/components/ui/carousel"; -import { Card, CardContent } from "@/components/ui/card"; -import CountUp from "react-countup"; -import { Progress } from "@/components/ui/progress"; import { Separator } from "@/components/ui/separator"; +import { Input } from "@/components/ui/input"; +import { CardsPaymentMethod } from "@/components/paymentMethod"; +import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"; import { Button } from "@/components/ui/button"; -import { ShareIcon, StarIcon } from "lucide-react"; -import { Toaster, toast } from "react-hot-toast"; -import useSession from "@/lib/supabase/useSession"; -import { redirect } from "next/navigation"; -import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; -import Link from "next/link"; +import { useState } from "react"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, + DialogTrigger, + DialogFooter, + DialogClose, +} from "@/components/ui/dialog"; +import { useRouter } from "next/navigation"; +import { toast } from "react-hot-toast"; + +const term_data = [ + { + term: "Minimum Investment", + description: "The minimum investment amount is $500.", + }, + { + term: "Investment Horizon", + description: "Investments are typically locked for a minimum of 12 months.", + }, + { + term: "Fees", + description: "A management fee of 2% will be applied annually.", + }, + { + term: "Returns", + description: "Expected annual returns are between 8% and 12%.", + }, + { + term: "Risk Disclosure", + description: "Investments carry risks, including the loss of principal.", + }, + { + term: "Withdrawal Policy", + description: "Withdrawals can be made after the lock-in period.", + }, +]; export default function Invest() { - const [progress, setProgress] = useState(0); - const [tab, setTab] = useState("Pitch"); - const { session, loading } = useSession(); - const user = session?.user; - const [sessionLoaded, setSessionLoaded] = useState(false); - const [isFollow, setIsFollow] = useState(false); + const [checkedTerms, setCheckedTerms] = useState(Array(term_data.length).fill(false)); + const [error, setError] = useState(""); + const router = useRouter(); // Initialize the router - useEffect(() => { - // set sessionLoaded to true once session is confirmed - if (!loading) { - setSessionLoaded(true); - } - }, [loading]); - const handleClick = (item: string) => { - setTab(item); + const handleCheckboxChange = (index: number) => { + const updatedCheckedTerms = [...checkedTerms]; + updatedCheckedTerms[index] = !updatedCheckedTerms[index]; + setCheckedTerms(updatedCheckedTerms); }; - const handleShare = () => { - const currentUrl = window.location.href; - if (document.hasFocus()) { - navigator.clipboard.writeText(currentUrl).then(() => { - toast.success("URL copied to clipboard!"); - }); - } - }; - const handleFollow = () => { - if (user) { - setIsFollow((prevState) => !prevState); - // save follow to database + const handleTermServiceClick = () => { + if (checkedTerms.some((checked) => !checked)) { + setError("Please accept all terms before proceeding with the investment."); } else { - redirect("/login"); + setError(""); + handleInvestmentSuccess(); } }; - useEffect(() => { - // percent success - const timer = setTimeout(() => setProgress(66), 500); - return () => clearTimeout(timer); - }, []); + + const handleInvestmentSuccess = () => { + toast.success("You successfully invested!"); + + setTimeout(() => { + router.push("/"); + }, 1000); + }; + return ( -
+
+

Invest on NVIDIA

+ +
- -
-
-
- {/* Name, star and share button packed */} -
-
- logo -
NVIDIA
-
-
-
- - - - - - -

Follow NIVIDIA

- - - -
-
- -
-
-
- {/* end of pack */} -

World's first non-metal sustainable battery

-
- {["Technology", "Gaming"].map((tag) => ( - - {tag} - - ))} -
-
- {/* image carousel */} -
- - - {Array.from({ length: 5 }).map((_, index) => ( - - - - ))} - {" "} - - - - - - {/* boiler plate for an actual pictures */} - - - - - - - - - - - - - - - - - -
-
-
-

- -

-

5% raised of $5M max goal

- -

- {" "} - -

-

Investors

-
- -

- hours -

-

Left to invest

- -
-
+
+

Investment Amount

+
-
- {/* menu */} - -
- {/* Card section */} -
- {/* Cards */} - - - - {tab} - - - + + +
+

Payment Information

+ +
+ + +
+

Terms and Services

+ + + + Select + Term + Description + + + + {term_data.map((item, index) => ( + + + handleCheckboxChange(index)} /> + + {item.term} + {item.description} + + ))} + +
+
+ + + + + + + + Are you absolutely sure? + This action cannot be undone. This will permanently! + + + + + + + + {error &&

{error}

} + +
); -} +} \ No newline at end of file diff --git a/src/app/overview/page.tsx b/src/app/overview/page.tsx new file mode 100644 index 0000000..f34d3cc --- /dev/null +++ b/src/app/overview/page.tsx @@ -0,0 +1,191 @@ +"use client"; + +import React, { useState, useEffect } from "react"; +import Image from "next/image"; +import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "@/components/ui/carousel"; +import { Card, CardContent } from "@/components/ui/card"; +import CountUp from "react-countup"; +import { Progress } from "@/components/ui/progress"; +import { Separator } from "@/components/ui/separator"; +import { Button } from "@/components/ui/button"; +import { ShareIcon, StarIcon } from "lucide-react"; +import { Toaster, toast } from "react-hot-toast"; +import useSession from "@/lib/supabase/useSession"; +import { redirect } from "next/navigation"; +import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; +import Link from "next/link"; + +export default function Invest() { + const [progress, setProgress] = useState(0); + const [tab, setTab] = useState("Pitch"); + const { session, loading } = useSession(); + const user = session?.user; + const [sessionLoaded, setSessionLoaded] = useState(false); + const [isFollow, setIsFollow] = useState(false); + + useEffect(() => { + // set sessionLoaded to true once session is confirmed + if (!loading) { + setSessionLoaded(true); + } + }, [loading]); + const handleClick = (item: string) => { + setTab(item); + }; + + const handleShare = () => { + const currentUrl = window.location.href; + if (document.hasFocus()) { + navigator.clipboard.writeText(currentUrl).then(() => { + toast.success("URL copied to clipboard!"); + }); + } + }; + const handleFollow = () => { + if (user) { + setIsFollow((prevState) => !prevState); + // save follow to database + } else { + redirect("/login"); + } + }; + useEffect(() => { + // percent success + const timer = setTimeout(() => setProgress(66), 500); + return () => clearTimeout(timer); + }, []); + return ( +
+
+ +
+
+
+ {/* Name, star and share button packed */} +
+
+ logo +
NVIDIA
+
+
+
+ + + + + + +

Follow NIVIDIA

+ + + +
+
+ +
+
+
+ {/* end of pack */} +

World's first non-metal sustainable battery

+
+ {["Technology", "Gaming"].map((tag) => ( + + {tag} + + ))} +
+
+ {/* image carousel */} +
+ + + {Array.from({ length: 5 }).map((_, index) => ( + + + + ))} + {" "} + + + + + + {/* boiler plate for an actual pictures */} + + + + + + + + + + + + + + + + + +
+
+
+

+ +

+

5% raised of $5M max goal

+ +

+ {" "} + +

+

Investors

+
+ +

+ hours +

+

Left to invest

+ +
+
+
+
+ {/* menu */} + +
+ {/* Card section */} +
+ {/* Cards */} + + + + {tab} + + + +
+
+ ); +} \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index 8650999..e370b63 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -78,7 +78,7 @@ export default function Home() {

The deals attracting the most interest right now

- + { await page.goto('http://127.0.0.1:3000/'); + + // Start Investing await page.getByRole('button', { name: 'Start Investing' }).click(); + // Filter by AI tag await page.locator('button').filter({ hasText: 'Tags' }).click(); await page.getByLabel('AI', { exact: true }).click(); - await page.locator('span#tag', { hasText: 'AI' }); + const aiTag = page.locator('span#tag', { hasText: 'AI' }); + await expect(aiTag).toBeVisible(); + // Filter by Technology tag await page.locator('button').filter({ hasText: 'AI' }).click(); await page.getByLabel('Technology').click(); - await page.locator('span#tag', { hasText: 'Technology' }); + const techTag = page.locator('span#tag', { hasText: 'Technology' }); + await expect(techTag).toBeVisible(); + // Filter by Consumer Electronics tag await page.locator('button').filter({ hasText: 'Technology' }).click(); - await page.getByText('Consumer Electronics').click(); - await page.locator('span#tag', { hasText: 'Consumer Electronics' }); + await page.getByLabel('Consumer Electronics').click(); + const consumerElectronicsTag = page.locator('span#tag', { hasText: 'Consumer Electronics' }); + await expect(consumerElectronicsTag).toBeVisible(); + // Filter by Software tag await page.locator('button').filter({ hasText: 'Consumer Electronics' }).click(); await page.getByLabel('Software').click(); - await page.locator('span#tag', { hasText: 'Software' }); + const softwareTag = page.locator('span#tag', { hasText: 'Software' }); + await expect(softwareTag).toBeVisible(); + // Filter by Internet tag await page.locator('button').filter({ hasText: 'Software' }).click(); await page.getByLabel('Internet').click(); - await page.locator('span#tag', { hasText: 'Internet' }); -}); \ No newline at end of file + const internetTag = page.locator('span#tag', { hasText: 'Internet' }); + await expect(internetTag).toBeVisible(); +});