diff --git a/package-lock.json b/package-lock.json index 9e75f4c..859de0b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "safedep-platform-frontend", "version": "0.1.0", "dependencies": { + "lucide-react": "^0.462.0", "next": "15.0.3", "react": "19.0.0-rc-66855b96-20241106", "react-dom": "19.0.0-rc-66855b96-20241106" @@ -3775,6 +3776,15 @@ "dev": true, "license": "ISC" }, + "node_modules/lucide-react": { + "version": "0.462.0", + "resolved": "https://registry.npmjs.org/lucide-react/-/lucide-react-0.462.0.tgz", + "integrity": "sha512-NTL7EbAao9IFtuSivSZgrAh4fZd09Lr+6MTkqIxuHaH2nnYiYIzXPo06cOxHg9wKLdj6LL8TByG4qpePqwgx/g==", + "license": "ISC", + "peerDependencies": { + "react": "^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc" + } + }, "node_modules/merge2": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", diff --git a/package.json b/package.json index 04a7f0c..9b7a6f1 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "prepare": "husky" }, "dependencies": { + "lucide-react": "^0.462.0", "next": "15.0.3", "react": "19.0.0-rc-66855b96-20241106", "react-dom": "19.0.0-rc-66855b96-20241106" diff --git a/src/app/auth/components/AuthButtons.tsx b/src/app/auth/components/AuthButtons.tsx new file mode 100644 index 0000000..319c6b5 --- /dev/null +++ b/src/app/auth/components/AuthButtons.tsx @@ -0,0 +1,30 @@ +import React from 'react'; +import { Lock, User } from 'lucide-react'; + +const AuthButtons: React.FC = () => { + return ( +
+ + + {/* Divider */} +
+
+
+
+
+ or +
+
+ + +
+ ); +}; + +export default AuthButtons; diff --git a/src/app/auth/components/ImageSection.tsx b/src/app/auth/components/ImageSection.tsx new file mode 100644 index 0000000..e7de744 --- /dev/null +++ b/src/app/auth/components/ImageSection.tsx @@ -0,0 +1,11 @@ +import React from 'react'; + +const ImageSection: React.FC = () => ( +
+ {/* Replace with actual image */} + {/* Authentication */} +
+); + +export default ImageSection; + diff --git a/src/app/auth/components/TextSection.tsx b/src/app/auth/components/TextSection.tsx new file mode 100644 index 0000000..67cd5e0 --- /dev/null +++ b/src/app/auth/components/TextSection.tsx @@ -0,0 +1,13 @@ +import React from 'react'; + +const TextSection: React.FC = () => ( +
+

Welcome to SafeDep

+

+ Get access to SafeDep Cloud APIs to integrate open source component + analysis and risk assessment into your CI/CD pipeline or custom workflow. +

+
+); + +export default TextSection; diff --git a/src/app/auth/page.tsx b/src/app/auth/page.tsx new file mode 100644 index 0000000..20f4230 --- /dev/null +++ b/src/app/auth/page.tsx @@ -0,0 +1,35 @@ +import React from 'react'; +import Badge from '../../components/Badge'; +import TermsAndPrivacy from '../../components/TermsAndPrivacy'; +import MainCard from '../../components/MainCard'; +import { CheckCircle, Shield } from 'lucide-react'; +import ImageSection from "./components/ImageSection"; +import TextSection from "./components/TextSection"; +import AuthButtons from './components/AuthButtons'; + +const Auth = () => { + return ( +
+ +
+
+ + +
+ + +
+
+
+

Get Started

+

Register for SafeDep Cloud to get API access.

+
+ + +
+ +
+ ); +}; + +export default Auth; diff --git a/src/app/auth/styles.css b/src/app/auth/styles.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/layout.tsx b/src/app/layout.tsx index a36cde0..9fcb21c 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -14,8 +14,8 @@ const geistMono = localFont({ }); export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "SafeDep | Open Source Software Supply Chain Security Platform", + description: "Welcome to SafeDep. Onboard to SafeDep cloud, generate authentication credentials and access platform APIs", }; export default function RootLayout({ diff --git a/src/app/page.tsx b/src/app/page.tsx index 3eee014..6617910 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,101 +1,5 @@ -import Image from "next/image"; +import { redirect } from "next/navigation"; export default function Home() { - return ( -
-
- Next.js logo -
    -
  1. - Get started by editing{" "} - - src/app/page.tsx - - . -
    2. -
  2. Save and see your changes instantly.
    3. -
- -
- - Vercel logomark - Deploy now - - - Read our docs - -
-
- -
- ); + redirect("/auth"); } diff --git a/src/components/Badge.tsx b/src/components/Badge.tsx new file mode 100644 index 0000000..2ee9ef7 --- /dev/null +++ b/src/components/Badge.tsx @@ -0,0 +1,18 @@ +import React from 'react'; +import { LucideIcon } from 'lucide-react'; + +interface BadgeProps { + icon: LucideIcon; + text: string; + bgColor: string; + textColor: string; +} + +const Badge: React.FC = ({ icon: Icon, text, bgColor, textColor }) => ( + + + {text} + +); + +export default Badge; diff --git a/src/components/Divider.tsx b/src/components/Divider.tsx new file mode 100644 index 0000000..01a1da1 --- /dev/null +++ b/src/components/Divider.tsx @@ -0,0 +1,16 @@ +import React from 'react'; + +const Divider: React.FC = () => { + return ( +
+
+
+
+
+ or +
+
+ ); +}; + +export default Divider; diff --git a/src/components/MainCard.tsx b/src/components/MainCard.tsx new file mode 100644 index 0000000..bf7c5f1 --- /dev/null +++ b/src/components/MainCard.tsx @@ -0,0 +1,15 @@ +import React from 'react'; + +interface MainCardProps { + children: React.ReactNode; +} + +const MainCard: React.FC = ({ children }) => { + return ( +
+ {children} +
+ ); +}; + +export default MainCard; diff --git a/src/components/TermsAndPrivacy.tsx b/src/components/TermsAndPrivacy.tsx new file mode 100644 index 0000000..2c7931e --- /dev/null +++ b/src/components/TermsAndPrivacy.tsx @@ -0,0 +1,14 @@ +import React from 'react'; + +const TermsAndPrivacy: React.FC = () => { + return ( +

+ By continuing, you agree to our{' '} + Terms of Service{' '} + and{' '} + Privacy Policy. +

+ ); +}; + +export default TermsAndPrivacy; diff --git a/src/page.tsx b/src/page.tsx new file mode 100644 index 0000000..e69de29