feat: foss weekened init

.eslintignore

@@ -0,0 +1,35 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

.eslintrc.json

@@ -0,0 +1,22 @@
+{
+  "root": true,
+  "env": {
+    "browser": true,
+    "amd": true,
+    "node": true,
+    "es6": true
+  },
+  "extends": ["eslint:recommended", "plugin:prettier/recommended", "next", "next/core-web-vitals"],
+  "rules": {
+    "prettier/prettier": "warn",
+    "react/react-in-jsx-scope": "off",
+    "react/prop-types": 0,
+    "no-unused-vars": 0,
+    "react/no-unescaped-entities": 0,
+    "no-useless-escape": "off",
+    "simple-import-sort/imports": "warn",
+    "simple-import-sort/exports": "warn",
+    "no-redeclare": "off"
+  },
+  "plugins": ["prettier", "simple-import-sort"]
+}

.gitignore

@@ -0,0 +1,41 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+.eslintcache
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+.env
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+# npm is the default pm
+yarn.lock

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx lint-staged

.prettierignore

@@ -0,0 +1,35 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

.prettierrc

@@ -0,0 +1,10 @@
+{
+  "semi": false,
+  "singleQuote": true,
+  "printWidth": 100,
+  "tabWidth": 2,
+  "useTabs": false,
+  "trailingComma": "es5",
+  "bracketSpacing": true,
+  "endOfLine": "auto"
+}

README.md

@@ -0,0 +1,45 @@
+# Wollete
+
+Wollete is a Next.js project designed to facilitate secure and anonymous digital receipt transmission for paperless transactions and billing among diverse entities. With a focus on privacy and convenience, Wollete aims to streamline the process of managing receipts in a digital environment.
+
+## Getting Started
+
+To get started with Wollete, follow these simple steps:
+
+1. **Install Dependencies**: 
+   ```bash
+   npm install
+   ```
+
+2. **Run the Development Server**: 
+   ```bash
+   npm run dev
+   ```
+   Or if you prefer using `yarn`:
+   ```bash
+   yarn dev
+   ```
+   Or with `pnpm`:
+   ```bash
+   pnpm dev
+   ```
+
+3. **Start Contributing**: Once the development server is up and running, you're all set to start contributing to the project.
+
+4. **View the Result**: Open [http://localhost:3000](http://localhost:3000) in your preferred web browser to see the Wollete project in action.
+
+## Contribution Guidelines
+
+Contributions to Wollete are welcome and encouraged! To contribute, please follow these guidelines:
+
+- Fork the repository and create a new branch for your contribution.
+- Ensure your code adheres to the project's coding standards and practices.
+- Submit a pull request detailing the changes you've made and explaining their purpose.
+
+## Feedback and Support
+
+If you encounter any issues while using Wollete or have suggestions for improvement, please don't hesitate to open an issue on the GitHub repository. Your feedback is invaluable in helping us enhance Wollete and make it even better.
+
+---
+
+Thank you for choosing Wollete! We hope it serves your needs effectively and simplifies your digital receipt management experience.

components/AboutusCard.js

@@ -0,0 +1,26 @@
+import Image from 'next/image'
+export default function AboutusCard({ name, job }) {
+  return (
+    <div className="rounded-[10px] bg-[#EBF4FF] mb:my-4">
+      <div className="p-3">
+        <Image src="/png/Aboutus/au-2.png" alt="Picture of the author" width={500} height={800} />
+      </div>
+      <div className="text-body-bold text-center pb-4">{name}</div>
+      <div className="text-body-regular text-center py-1">{job}</div>
+      <div className="flex items-center justify-center pt-6">
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          width="40"
+          height="40"
+          viewBox="0 0 40 40"
+          fill="none"
+        >
+          <path
+            d="M11.8762 9.89017C11.8758 10.6563 11.5659 11.3909 11.0146 11.9324C10.4633 12.4739 9.71585 12.7778 8.93662 12.7775C8.15739 12.7771 7.41023 12.4724 6.85951 11.9303C6.30878 11.3883 5.99961 10.6534 6 9.88728C6.00039 9.12115 6.31031 8.38654 6.86159 7.84507C7.41286 7.3036 8.16033 6.99962 8.93956 7C9.71879 7.00038 10.466 7.3051 11.0167 7.84711C11.5674 8.38912 11.8766 9.12403 11.8762 9.89017ZM11.9643 14.9166H6.08814V33H11.9643V14.9166ZM21.2487 14.9166H15.4019V33H21.1899V23.5105C21.1899 18.2242 28.1973 17.7331 28.1973 23.5105V33H34V21.5462C34 12.6345 23.6285 12.9667 21.1899 17.3431L21.2487 14.9166Z"
+            fill="#0E72E8"
+          />
+        </svg>
+      </div>
+    </div>
+  )
+}

components/AddressInput/InputLine1.js

@@ -0,0 +1,38 @@
+import { Autocomplete, TextField } from '@mui/material'
+import React from 'react'
+
+const InputLine1 = ({ id, postalCodeValue, register, errors, setGeoLocation, disabled, value }) => {
+  return (
+    <Autocomplete
+      fullWidth
+      disableClearable
+      autoHighlight
+      // allow user to enter custom value
+      freeSolo
+      id={id}
+      getOptionLabel={(option) => (typeof option == 'object' ? option.firstLine || '' : option)}
+      options={postalCodeValue?.entries || []}
+      // geoLocation is derived from merchant address (line 1)
+      onChange={(event, newValue) => {
+        setGeoLocation(newValue?.geoLocation)
+      }}
+      renderInput={(params) => (
+        <TextField
+          {...params}
+          label={'Address Line 1'}
+          onFocus={(event) => {
+            event.target.setAttribute('autocomplete', 'new-password')
+          }}
+          InputProps={{
+            ...params.InputProps,
+          }}
+          {...register(id, { required: true })}
+          error={!!errors[id]}
+          helperText={errors[id] && `${'Address Line 1'} is required`}
+        />
+      )}
+    />
+  )
+}
+
+export default InputLine1

components/AddressInput/InputLine2.js

@@ -0,0 +1,34 @@
+import { Autocomplete, TextField } from '@mui/material'
+import React from 'react'
+
+const InputLine2 = ({ id, postalCodeValue, register, errors }) => {
+  return (
+    <Autocomplete
+      fullWidth
+      disableClearable
+      autoHighlight
+      // allow user to enter custom value
+      freeSolo
+      id={id}
+      getOptionLabel={(option) => (typeof option == 'object' ? option.secondLine || '' : option)}
+      options={postalCodeValue?.entries || []}
+      renderInput={(params) => (
+        <TextField
+          {...params}
+          label={'Address Line 2'}
+          onFocus={(event) => {
+            event.target.setAttribute('autocomplete', 'new-password')
+          }}
+          InputProps={{
+            ...params.InputProps,
+          }}
+          {...register(id)}
+          error={!!errors[id]}
+          helperText={errors[id] && `${'Address Line 2'} is required`}
+        />
+      )}
+    />
+  )
+}
+
+export default InputLine2

components/AddressInput/InputPostalCode.js

@@ -0,0 +1,96 @@
+import { Autocomplete, CircularProgress, TextField } from '@mui/material'
+import axios from 'axios'
+import React, { useEffect, useState } from 'react'
+
+const InputPostalCode = ({
+  id,
+  register,
+  errors,
+  postalCodeValue,
+  setPostalCodeValue,
+  setAdministrativeAreaId,
+  setAdministrativeAreaCode,
+  countryCode,
+}) => {
+  const [loading, setLoading] = useState(false)
+  const [inputValue, setInputValue] = React.useState('')
+  const [postalCodes, setPostalCodes] = useState([])
+
+  // value is shared b/w InputPostalCode, InputLine1 & InputLine2
+  // hence defined in parent and passed as a prop instead
+
+  useEffect(() => {
+    // get postCodes & administrativeAreas from country
+    const fetchData = async () => {
+      try {
+        setLoading(true)
+        const res1 = await axios.get('/api/v1/post-codes', {
+          params: { countryCode },
+        })
+        setPostalCodes(res1.data.data)
+        setLoading(false)
+
+        const res2 = await axios.get('/api/v1/administrative-areas', {
+          params: { countryCode },
+        })
+        setAdministrativeAreaId(res2.data.data[0]?.id) // is actually set in payload
+        setAdministrativeAreaCode(res2.data.data[0]?.code) // is needed for fetching towns
+      } catch (err) {
+        console.log(err)
+      } finally {
+        setLoading(false)
+      }
+    }
+    fetchData()
+  }, [countryCode])
+  return (
+    <Autocomplete
+      fullWidth
+      disableClearable
+      autoHighlight
+      // allow user to enter custom value
+      freeSolo
+      id={id}
+      // option.postCode || "option" for freeSolo
+      getOptionLabel={(option) => (typeof option == 'object' ? option.postCode || '' : option)}
+      options={postalCodes}
+      loading={loading}
+      // value, onChange, inputValue, onInputChange
+      // ccutom useStates required
+      // coz react-hook-forms is not updating states properly
+      value={postalCodeValue}
+      onChange={(event, newValue) => {
+        setPostalCodeValue(newValue)
+      }}
+      inputValue={inputValue}
+      onInputChange={(event, newInputValue) => {
+        setInputValue(newInputValue)
+      }}
+      renderInput={(params) => (
+        <TextField
+          {...params}
+          label={'Postal Code'}
+          autoComplete="new-password"
+          // autoComplete="new-password" somehow get's changed to "off" on focus
+          onFocus={(event) => {
+            event.target.setAttribute('autocomplete', 'new-password')
+          }}
+          InputProps={{
+            ...params.InputProps,
+            endAdornment: (
+              <div>
+                {loading ? <CircularProgress color="inherit" size={20} /> : null}
+                {params.InputProps.endAdornment}
+              </div>
+            ),
+          }}
+          {...register(id, { required: true })}
+          error={!!errors[id]}
+          helperText={errors[id] && `${'Postal Code'} is required`}
+        />
+      )}
+    />
+  )
+}
+
+export default InputPostalCode