Merge

calblueprint · Oct 7, 2023 · d8aca4e · d8aca4e
2 parents 7d0be8f + 2ddf3fc
commit d8aca4e
Show file tree

Hide file tree

Showing 19 changed files with 3,460 additions and 139 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,5 +1,5 @@
 module.exports = {
-    extends: ["@calblueprint/eslint-config-react", "eslint:recommended", "plugin:react/recommended", "plugin:prettier/recommended"],
+    extends: ["@calblueprint/eslint-config-react"],
     rules: {
       // Add any custom rules here
       // Disable the rule that requires React to be in scope -- we don't need this with React 18

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -12,7 +12,6 @@
     "prettier:fix": "npx prettier --write ."
   },
   "dependencies": {
-    "@calblueprint/prettier-config": "^0.0.1",
     "@supabase/supabase-js": "^2.37.0",
     "@types/node": "20.6.3",
     "@types/react": "18.2.22",
@@ -21,19 +20,22 @@
     "eslint-config-next": "13.5.2",
     "next": "13.5.2",
     "react": "18.2.0",
-    "react-dom": "18.2.0"
+    "react-dom": "18.2.0",
+    "styled-components": "^6.0.8"
   },
   "devDependencies": {
     "@calblueprint/eslint-config-react": "^0.0.3",
+    "@calblueprint/prettier-config": "^0.0.1",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
-    "eslint": "^8.49.0",
+    "eslint": "^8.50.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-prettier": "^8.10.0",
     "eslint-plugin-import": "^2.28.1",
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
+    "file-loader": "^6.2.0",
     "prettier": "^2.8.8",
     "typescript": "^4.9.5"
   }

diff --git a/src/api/supabase/queries /createClient.ts b/src/api/supabase/queries /createClient.ts
@@ -0,0 +1,20 @@
+import { createClient } from '@supabase/supabase-js';
+import dotenv from 'dotenv';
+
+dotenv.config();
+
+if (
+  !process.env.NEXT_PUBLIC_SUPABASE_URL ||
+  !process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY
+) {
+  throw new Error(
+    'No Supabase environment variables detected, please make sure they are in place!',
+  );
+}
+
+const supabase = createClient(
+  process.env.NEXT_PUBLIC_SUPABASE_URL,
+  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY,
+);
+
+export default supabase;
diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx
@@ -0,0 +1,7 @@
+export default function Checkout() {
+  return (
+    <main>
+      <div>Checkout</div>
+    </main>
+  );
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,22 +1,22 @@
-import './globals.css'
-import type { Metadata } from 'next'
-import { Inter } from 'next/font/google'
+import './globals.css';
+import type { Metadata } from 'next';
+import { Inter } from 'next/font/google';
 
-const inter = Inter({ subsets: ['latin'] })
+const inter = Inter({ subsets: ['latin'] });
 
 export const metadata: Metadata = {
   title: 'Shanti Project',
   description: 'Application Created by Blueprint',
-}
+};
 
 export default function RootLayout({
   children,
 }: {
-  children: React.ReactNode
+  children: React.ReactNode;
 }) {
   return (
     <html lang="en">
       <body className={inter.className}>{children}</body>
     </html>
-  )
+  );
 }
diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx
@@ -0,0 +1,34 @@
+'use client';
+
+import Link from 'next/link';
+import LoginForm from '../../components/LoginForm';
+
+import {
+  GlobalStyle,
+  Fullscreen,
+  Img,
+  LoginBox,
+  LoginContent,
+  WelcomeSign,
+  Button,
+} from './styles';
+
+export default function App() {
+  return (
+    <main>
+      <GlobalStyle />
+      <Fullscreen>
+        <Img />
+        <LoginBox>
+          <LoginContent>
+            <WelcomeSign>Welcome</WelcomeSign>
+            <LoginForm />
+            <Button>
+              <Link href="/storefront">Log In</Link>
+            </Button>
+          </LoginContent>
+        </LoginBox>
+      </Fullscreen>
+    </main>
+  );
+}
diff --git a/src/app/login/shantiLogo.png b/src/app/login/shantiLogo.png
diff --git a/src/app/login/styles.ts b/src/app/login/styles.ts
@@ -0,0 +1,79 @@
+import styled, { createGlobalStyle } from 'styled-components';
+
+export const GlobalStyle = createGlobalStyle`
+  body {
+    background:white;
+  }
+`;
+export const LoginBox = styled.div`
+  display: flex;
+  flex-direction: column;
+  width: 500px;
+  height: 420px;
+  margin-left: 450px;
+  margin-top: 80px;
+  border: 1px solid #b3b3b3;
+`;
+
+export const LoginContent = styled.div`
+  margin-left: 40px;
+  margin-top: 30px;
+`;
+
+export const Button = styled.button`
+  margin-top: 40px;
+  color: #fff;
+  text-align: center;
+  font-family: Inter;
+  font-size: 17px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: normal;
+  width: 420px;
+  height: 40px;
+  border-radius: 8px;
+  background: #000;
+  border: transparent;
+`;
+
+export const WelcomeSign = styled.div`
+  color: #000;
+  font-family: Inter;
+  font-size: 40px;
+  font-style: normal;
+  font-weight: 700;
+  line-height: normal;
+  margin-bottom: 30px;
+`;
+
+export const Input = styled.input`
+  background: #d9d9d9;
+  border: transparent;
+  width: 420px;
+  height: 40px;
+  padding-left: 10px;
+`;
+
+export const FormHeaders = styled.p`
+  color: #000;
+  font-family: Inter;
+  font-size: 15px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+  margin-top: 20px;
+  margin-bottom: 10px;
+`;
+
+export const Fullscreen = styled.div`
+  width: 100 %;
+  height: 100 %;
+`;
+export const Img = styled.div`
+  background-color: yellow;
+  align-self: flex - start;
+  justify-self: flex - start;
+  height: 50px;
+  width: 110px;
+  margin: 20px;
+`;
diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -1,95 +1,9 @@
-import Image from 'next/image'
-import styles from './page.module.css'
+import Link from 'next/link';
 
-export default function Home() {
+export default function Checkout() {
   return (
-    <main className={styles.main}>
-      <div className={styles.description}>
-        <p>
-          Get started by editing&nbsp;
-          <code className={styles.code}>src/app/page.tsx</code>
-        </p>
-        <div>
-          <a
-            href="https://vercel.com?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            By{' '}
-            <Image
-              src="/vercel.svg"
-              alt="Vercel Logo"
-              className={styles.vercelLogo}
-              width={100}
-              height={24}
-              priority
-            />
-          </a>
-        </div>
-      </div>
-
-      <div className={styles.center}>
-        <Image
-          className={styles.logo}
-          src="/next.svg"
-          alt="Next.js Logo"
-          width={180}
-          height={37}
-          priority
-        />
-      </div>
-
-      <div className={styles.grid}>
-        <a
-          href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Docs <span>-&gt;</span>
-          </h2>
-          <p>Find in-depth information about Next.js features and API.</p>
-        </a>
-
-        <a
-          href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Learn <span>-&gt;</span>
-          </h2>
-          <p>Learn about Next.js in an interactive course with&nbsp;quizzes!</p>
-        </a>
-
-        <a
-          href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Templates <span>-&gt;</span>
-          </h2>
-          <p>Explore the Next.js 13 playground.</p>
-        </a>
-
-        <a
-          href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
-          className={styles.card}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <h2>
-            Deploy <span>-&gt;</span>
-          </h2>
-          <p>
-            Instantly deploy your Next.js site to a shareable URL with Vercel.
-          </p>
-        </a>
-      </div>
+    <main>
+      <Link href="/login">Login</Link>
     </main>
-  )
+  );
 }
diff --git a/src/app/profileScreen/page.tsx b/src/app/profileScreen/page.tsx
@@ -0,0 +1,7 @@
+export default function Profile() {
+  return (
+    <main>
+      <div>Profile</div>
+    </main>
+  );
+}
diff --git a/src/app/storefront/page.tsx b/src/app/storefront/page.tsx
@@ -0,0 +1,7 @@
+export default function Storefront() {
+  return (
+    <main>
+      <div>storefront</div>
+    </main>
+  );
+}
diff --git a/src/app/types/types.txt b/src/app/types/types.txt
diff --git a/src/app/util/util.txt b/src/app/util/util.txt
diff --git a/src/components/InputFields.tsx b/src/components/InputFields.tsx
@@ -0,0 +1,18 @@
+'use client';
+
+import { FormHeaders, Input } from '../app/login/styles';
+
+export default function InputFields(props: {
+  text: string;
+  placeholder: string;
+}) {
+  const { text, placeholder } = props;
+  return (
+    <main>
+      <div id="userInfo">
+        <FormHeaders>{text}</FormHeaders>
+        <Input type="text" placeholder={placeholder} />
+      </div>
+    </main>
+  );
+}
diff --git a/src/components/LoginForm.tsx b/src/components/LoginForm.tsx
@@ -0,0 +1,12 @@
+'use client';
+
+import InputFields from './InputFields';
+
+export default function LoginForm() {
+  return (
+    <div>
+      <InputFields text="Email address" placeholder="[email protected]" />
+      <InputFields text="Password" placeholder="************" />
+    </div>
+  );
+}
diff --git a/src/components/components.txt b/src/components/components.txt
diff --git a/src/database/database.txt b/src/database/database.txt
diff --git a/tsconfig.json b/tsconfig.json
@@ -1,7 +1,11 @@
 {
   "compilerOptions": {
     "target": "es5",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -19,7 +23,19 @@
       }
     ],
     "paths": {
-      "@/*": ["./src/*"]
-    }
+      "@/*": [
+        "./src/*"
+      ]
+    },
+    "forceConsistentCasingInFileNames": true
   },
+  "include": [
+    "next-env.d.ts",
+    ".next/types/**/*.ts",
+    "**/*.ts",
+    "**/*.tsx"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
 }