diff --git a/apps/extension_app/package.json b/apps/extension_app/package.json index 933dd50..d081c2b 100644 --- a/apps/extension_app/package.json +++ b/apps/extension_app/package.json @@ -21,7 +21,11 @@ "typescript": "^5.0.4", "viem": "^1.19.11", "wagmi": "^1.4.10", - "web-vitals": "^2.1.4" + "web-vitals": "^2.1.4", + "ajv": "^8.12.0", + "ts-loader": "^9.4.2", + "webpack": "^5.75.0", + "webpack-cli": "^5.0.1" }, "devDependencies": { "@types/chrome": "^0.0.254", @@ -33,11 +37,5 @@ "scripts": { "build:ext": "webpack --config webpack.config.js", "watch": "webpack -w --config webpack.config.js" - }, - "devDependencies": { - "ajv": "^8.12.0", - "ts-loader": "^9.4.2", - "webpack": "^5.75.0", - "webpack-cli": "^5.0.1" } } \ No newline at end of file diff --git a/apps/web/package.json b/apps/web/package.json index fa1f8c4..17c72c7 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -4,21 +4,24 @@ "version": "0.0.0", "type": "module", "scripts": { - "dev": "vite", + "dev": "vite --debug hmr", "build": "vite build", "preview": "vite preview" }, "dependencies": { "react": "^18.2.0", "react-dom": "^18.2.0", + "react-router-dom": "^6.22.0", "react-scripts": "^5.0.1" }, "devDependencies": { + "@types/node": "^16.18.79", "@types/react": "^18.0.15", "@types/react-dom": "^18.0.6", "@types/react-router-dom": "^5.3.3", - "@vitejs/plugin-react": "^2.0.0", + "@vitejs/plugin-react": "^4.2.1", "autoprefixer": "^10.4.7", + "daisyui": "^4.6.1", "postcss": "^8.4.14", "tailwindcss": "^3.1.6", "typescript": "^5.3.3", diff --git a/apps/web/src/App.tsx b/apps/web/src/App.tsx index 13060cc..9e233b6 100644 --- a/apps/web/src/App.tsx +++ b/apps/web/src/App.tsx @@ -1,10 +1,10 @@ -import React from "react"; -import styles from "./style"; -import { Billing, Business, CardDeal, Clients, CTA, Footer, Navbar, Stats, Testimonials, Hero } from "./components"; +import React from 'react' +import styles from './style' +import { Billing, Business, CardDeal, Clients, CTA, Footer, Navbar, Stats, Testimonials, Hero } from './components' export default function App() { return ( -
+
diff --git a/apps/web/src/components/Billing.tsx b/apps/web/src/components/Billing.tsx index 31e2268..f4910c8 100644 --- a/apps/web/src/components/Billing.tsx +++ b/apps/web/src/components/Billing.tsx @@ -1,23 +1,23 @@ import React from 'react' -import { apple, bill, google } from "../assets" -import styles, { layout } from "../style" +import { apple, bill, google } from '../assets' +import styles, { layout } from '../style' export default function Billing() { return ( -
+
- billing + billing {/* gradient start */} -
-
+
+
{/* gradient end */}

- Easily control your
billing & + Easily control your
billing & invoicing

@@ -26,9 +26,9 @@ export default function Billing() { placerat.

-
- google_play - google_play +
+ google_play + google_play
diff --git a/apps/web/src/components/Business.tsx b/apps/web/src/components/Business.tsx index 70fabc9..2982631 100644 --- a/apps/web/src/components/Business.tsx +++ b/apps/web/src/components/Business.tsx @@ -1,19 +1,20 @@ import React from 'react' -import { features } from "../constants" -import styles, { layout } from "../style" -import Button from "./Button" +import {featureTypes} from '../models/type/ui.type' +import { features } from '../constants' +import styles, { layout } from '../style' +import Button from './Button' -export function FeatureCard(props: any) { +export function FeatureCard(props: featureTypes) { return ( -
+
- star + star
-
-

+
+

{props.title}

-

+

{props.content}

@@ -23,10 +24,10 @@ export function FeatureCard(props: any) { export default function Business() { return ( -
+

- You do the business,
we’ll handle + You do the business,
we’ll handle the money.

diff --git a/apps/web/src/components/Button.tsx b/apps/web/src/components/Button.tsx index dc2d2f3..890869f 100644 --- a/apps/web/src/components/Button.tsx +++ b/apps/web/src/components/Button.tsx @@ -1,8 +1,8 @@ -import React from "react" +import React from 'react' export default function Button(styles: any) { return ( - ) diff --git a/apps/web/src/components/CTA.tsx b/apps/web/src/components/CTA.tsx index d61cfaf..e847b8f 100644 --- a/apps/web/src/components/CTA.tsx +++ b/apps/web/src/components/CTA.tsx @@ -1,11 +1,11 @@ import React from 'react' -import styles from "../style"; -import Button from "./Button"; +import styles from '../style' +import Button from './Button' export default function CTA() { return (

-
+

Let’s try our service now!

Everything you need to accept card payments and grow your business diff --git a/apps/web/src/components/CardDeal.tsx b/apps/web/src/components/CardDeal.tsx index 0a60a7d..d56293d 100644 --- a/apps/web/src/components/CardDeal.tsx +++ b/apps/web/src/components/CardDeal.tsx @@ -1,14 +1,14 @@ import React from 'react' -import { card } from "../assets" -import styles, { layout } from "../style" -import Button from "./Button" +import { card } from '../assets' +import styles, { layout } from '../style' +import Button from './Button' export default function CardDeal() { return (

- Find a better card deal
in few easy + Find a better card deal
in few easy steps.

@@ -20,7 +20,7 @@ export default function CardDeal() {

- billing + billing
) diff --git a/apps/web/src/components/Clients.tsx b/apps/web/src/components/Clients.tsx index 828add6..b792be9 100644 --- a/apps/web/src/components/Clients.tsx +++ b/apps/web/src/components/Clients.tsx @@ -1,14 +1,15 @@ import React from 'react' -import { clients } from "../constants"; -import styles from "../style"; +import { clients } from '../constants' +import styles from '../style' +import { clientsTypes } from 'src/models/type/ui.type' export default function Clients() { return (
- {clients.map((client) => ( + {clients.map((client: clientsTypes) => (
- client_logo + client_logo
))}
diff --git a/apps/web/src/components/FeedbackCard.tsx b/apps/web/src/components/FeedbackCard.tsx index 90434b0..1436495 100644 --- a/apps/web/src/components/FeedbackCard.tsx +++ b/apps/web/src/components/FeedbackCard.tsx @@ -1,22 +1,23 @@ -import React, { FC } from "react"; -import { quotes } from "../assets"; +import React from 'react' +import { quotes } from '../assets' +import { feedbackTypes } from 'src/models/type/ui.type' -export default function FeedbackCard (props: any) { +export default function FeedbackCard (props: feedbackTypes) { return ( -
- double_quotes -

+

+ double_quotes +

{props.content}

-
- {props.name} -
-

+
+ {props.name} +
+

{props.name}

-

+

{props.title}

diff --git a/apps/web/src/components/Footer.tsx b/apps/web/src/components/Footer.tsx index 93e89f1..e72271d 100644 --- a/apps/web/src/components/Footer.tsx +++ b/apps/web/src/components/Footer.tsx @@ -1,34 +1,35 @@ import React from 'react' -import styles from "../style"; -import { logo } from "../assets"; -import { footerLinks, socialMedia } from "../constants"; +import styles from '../style' +import { logo } from '../assets' +import { footerLinks, socialMedia } from '../constants' +import { footerLinksTypes, socialMediaTypes } from 'src/models/type/ui.type' export default function Footer() { return (
-
+
hoobank

A new way to make the payments easy, reliable and secure.

-
- {footerLinks.map((footerlink) => ( +
+ {footerLinks.map((footerlink: footerLinksTypes) => (
-

+

{footerlink.title}

-
    +
      {footerlink.links.map((link, index) => (
    • {link.name} @@ -40,18 +41,18 @@ export default function Footer() {
-
-

+

+

Copyright Ⓒ 2022 HooBank. All Rights Reserved.

-
- {socialMedia.map((social, index) => ( +
+ {socialMedia.map((social:socialMediaTypes, index) => ( {social.id} window.open(social.link)} /> diff --git a/apps/web/src/components/GetStarted.tsx b/apps/web/src/components/GetStarted.tsx index 674558e..ef7fb82 100644 --- a/apps/web/src/components/GetStarted.tsx +++ b/apps/web/src/components/GetStarted.tsx @@ -1,20 +1,20 @@ -import React from "react"; -import styles from "../style"; -import { arrowUp } from "../assets"; +import React from 'react' +import styles from '../style' +import { arrowUp } from '../assets' export default function GetStarted() { return (
-

- Get +

+ Get

- arrow-up + arrow-up
-

- Started +

+ Started

diff --git a/apps/web/src/components/Hero.tsx b/apps/web/src/components/Hero.tsx index f21088f..b94abe1 100644 --- a/apps/web/src/components/Hero.tsx +++ b/apps/web/src/components/Hero.tsx @@ -1,31 +1,32 @@ -import React from "react"; -import styles from "../style"; -import { discount, robot } from "../assets"; -import GetStarted from "./GetStarted"; +import React from 'react' +import styles from '../style' +import { discount, robot } from '../assets' +import GetStarted from './GetStarted' +import { Link } from 'react-router-dom' export default function Hero() { return ( -
+
-
- discount +
+ discount

- 20% Discount For{" "} - 1 Month Account + 20% Discount For{' '} + 1 Month Account

-
-

- The Next
{" "} - Generation{" "} +
+

+ The Next
{' '} + Generation{' '}

-
- +
+
-

+

Payment Method.

@@ -36,17 +37,17 @@ export default function Hero() {

- billing + billing {/* gradient start */} -
-
-
+
+
+
{/* gradient end */}
- +

) diff --git a/apps/web/src/components/Navbar.tsx b/apps/web/src/components/Navbar.tsx index 5f0d381..7612d0b 100644 --- a/apps/web/src/components/Navbar.tsx +++ b/apps/web/src/components/Navbar.tsx @@ -1,21 +1,22 @@ -import React, { useState } from "react"; -import { close, logo, menu } from "../assets"; -import { navLinks } from "../constants"; +import React, { useState } from 'react' +import { close, logo, menu } from '../assets' +import { navLinks } from '../constants' +import { navLinksTypes } from 'src/models/type/ui.type' export default function Navbar() { - const [active, setActive] = useState("Home"); - const [toggle, setToggle] = useState(false); + const [active, setActive] = useState('Home') + const [toggle, setToggle] = useState(false) return ( -