draft sign up

.github/ISSUE_TEMPLATE/bug_report.md

@@ -6,21 +6,17 @@ labels: bug
 assignees: ""
 ---
 
-**Describe the bug**
-A clear and concise description of what the bug is.
+**Describe the bug** A clear and concise description of what the bug is.
 
-**To Reproduce**
-Steps to reproduce the behavior:
-(we recommend record a screenshot to show the case, like using http://loom.com to record)
+**To Reproduce** Steps to reproduce the behavior: (we recommend record a
+screenshot to show the case, like using http://loom.com to record)
 
-**Expected behavior**
-A clear and concise description of what you expected to happen.
+**Expected behavior** A clear and concise description of what you expected to
+happen.
 
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
+**Screenshots** If applicable, add screenshots to help explain your problem.
 
-\*\* Node.js version
-(The node version on your computer to run the project)
+\*\* Node.js version (The node version on your computer to run the project)
 
 **Desktop (please complete the following information):**
 
@@ -35,5 +31,4 @@ If applicable, add screenshots to help explain your problem.
 - Browser [e.g. stock browser, safari]
 - Version [e.g. 22]
 
-**Additional context**
-Add any other context about the problem here.
+**Additional context** Add any other context about the problem here.

.github/pull_request_template.md

@@ -1,33 +1,34 @@
-## <!--
+<!--
 
-name: "Monorepo Contribution"
-about: "Template for contributions in a monorepo with apps and packages folders"
-title: "[Feature/Bug] - Title"
-labels: ["contribution"]
-assignees: "" # Leave blank if no specific assignee
+name: "Monorepo Contribution" about: "Template for contributions in a monorepo
+with apps and packages folders" title: "[Feature/Bug] - Title" labels:
+["contribution"] assignees: "" # Leave blank if no specific assignee
 
 ---
 
 -->
 
-### Description
+# Description
 
-Please provide a clear and concise description of the changes made, including the purpose and context.
+Please provide a clear and concise description of the changes made, including
+the purpose and context.
 
 **Fixes**: # (issue number)  
 or  
 **Resolves**: # (issue number)
 
 ---
 
-### Changes Made
+## Changes Made
 
-- [ ] Changes in **`apps`** folder (specify the app and briefly describe the changes):
+- [ ] Changes in **`apps`** folder (specify the app and briefly describe the
+      changes):
 
   - [ ] `Web`
   - [ ] `Native`
 
-- [ ] Changes in **`packages`** folder (specify the package and briefly describe the changes):
+- [ ] Changes in **`packages`** folder (specify the package and briefly describe
+      the changes):
   - [ ] `Core`
 
 ---
@@ -36,12 +37,13 @@ or
 
 - [ ] 🐛 **Bug fix** (non-breaking change which fixes an issue)
 - [ ] ✨ **New feature** (non-breaking change which adds functionality)
-- [x] 💥 **Breaking change** (fix or feature that would cause existing functionality to not work as expected)
+- [ ] 💥 **Breaking change** (fix or feature that would cause existing
+      functionality to not work as expected)
 - [ ] 📝 **Documentation update** (changes)
 
 ---
 
-## Screenshots
+#### Screenshots
 
 |       Before        |       After        |
 | :-----------------: | :----------------: |

.github/workflows/lint-format.yml

@@ -0,0 +1,33 @@
+name: Lint & Commit Check
+
+on:
+  pull_request:
+  push:
+    branches:
+      - main
+
+jobs:
+  lint-format:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20.x"
+          cache: "yarn"
+
+      - name: Install dependencies
+        run: yarn install --frozen-lockfile
+
+      - name: Run Prettier Check
+        run: yarn prettier --check .
+
+      - name: Run Lint-Staged (Prettier & ESLint)
+        run: yarn lint-staged
+
+      - name: Run Commitlint on Last Commit
+        run: git log -1 --pretty=format:%s | npx --no -- commitlint

.prettierignore

@@ -0,0 +1,2 @@
+node_modules
+bin

.prettierrc

@@ -5,5 +5,13 @@
   "trailingComma": "all",
   "useTabs": false,
   "tabWidth": 2,
-  "singleQuote": false
+  "singleQuote": false,
+  "overrides": [
+    {
+      "files": "*.md",
+      "options": {
+        "proseWrap": "always"
+      }
+    }
+  ]
 }

README.md

@@ -1,59 +1,78 @@
 # Treetracker Wallet App: Secure and Easy Token Management
 
-**Greenstand** provides a secure and user-friendly platform for managing your digital tokens. Sending and receiving tokens takes just a few taps, making it a breeze to transfer them between users.
+**Greenstand** provides a secure and user-friendly platform for managing your
+digital tokens. Sending and receiving tokens takes just a few taps, making it a
+breeze to transfer them between users.
 
 ## **Project Structure:**
 
-Treetracker leverages a monorepo structure, meaning it houses multiple projects in a single repository. This allows for efficient code sharing across different platforms. Here's a breakdown:
+Treetracker leverages a monorepo structure, meaning it houses multiple projects
+in a single repository. This allows for efficient code sharing across different
+platforms. Here's a breakdown:
 
-- **`apps/native`:** This directory contains the React Native code for the mobile app.
+- **`apps/native`:** This directory contains the React Native code for the
+  mobile app.
 
 - **`apps/web`:** This directory holds the Next.js code for the web app.
 
-- **`packages/core`:** This shared folder contains the core model layer, accessible by both the mobile and web apps.
+- **`packages/core`:** This shared folder contains the core model layer,
+  accessible by both the mobile and web apps.
 
 ## **Getting Started:**
 
 Excited to dive in? Here's how to get up and running:
 
-1.  **Clone the repository:** Use `git clone https://github.com/Greenstand/treetracker-wallet-app` to grab the code.
+1.  **Clone the repository:** Use
+    `git clone https://github.com/Greenstand/treetracker-wallet-app` to grab the
+    code.
 
-2.  **Install dependencies:** Run `yarn` in the main project directory to install all the necessary tools.
+2.  **Install dependencies:** Run `yarn` in the main project directory to
+    install all the necessary tools.
 
 3.  **Start Development Server (Choose your platform):**
 
-- **Web App:** Navigate to the `web` directory and run `yarn dev`. This launches the Next.js development server, accessible at http://localhost:3000 in your web browser.
+- **Web App:** Navigate to the `web` directory and run `yarn dev`. This launches
+  the Next.js development server, accessible at http://localhost:3000 in your
+  web browser.
 
-- **Mobile App:** Head to the `native` directory and run `yarn start`. This starts the Expo development server for your mobile app.
+- **Mobile App:** Head to the `native` directory and run `yarn start`. This
+  starts the Expo development server for your mobile app.
 
 ## **Changelog**
 
-We use [Conventional Changelog](https://github.com/conventional-changelog/conventional-changelog) to generate our changelog. This means that all changes should be committed using the Conventional Commits format.
+We use
+[Conventional Changelog](https://github.com/conventional-changelog/conventional-changelog)
+to generate our changelog. This means that all changes should be committed using
+the Conventional Commits format.
 
-Here are some examples of commit messages and how they would appear in the changelog:
+Here are some examples of commit messages and how they would appear in the
+changelog:
 
-- **feat:** A new feature
-  Commit message: `feat: add support for token transfers`
+- **feat:** A new feature Commit message:
+  `feat: add support for token transfers`
 
-- **fix:** A bug fix
-  Commit message: `fix: prevent token balance from being negative`
+- **fix:** A bug fix Commit message:
+  `fix: prevent token balance from being negative`
 
-- **docs:** An update to documentation
-  Commit message: `docs: add instructions for contributing`
+- **docs:** An update to documentation Commit message:
+  `docs: add instructions for contributing`
 
 ## **Contributing:**
 
 We value your input! Here's how to contribute:
 
 - **Found a bug or have an idea?** Open an issue on our GitHub repository.
 
-- **Want to add code?** Fork the repository, make your changes, and submit a pull request.
+- **Want to add code?** Fork the repository, make your changes, and submit a
+  pull request.
 
-- **Testing and Documentation Matter:** Ensure your code is well-tested and adheres to our coding standards before submitting.
+- **Testing and Documentation Matter:** Ensure your code is well-tested and
+  adheres to our coding standards before submitting.
 
 **Thank You!**
 
-We appreciate your interest in contributing to Treetracker. Your time and effort are invaluable in making this project even better!
+We appreciate your interest in contributing to Treetracker. Your time and effort
+are invaluable in making this project even better!
 
 **For further details, explore the individual project READMEs:**
 

apps/native/README.md

@@ -2,13 +2,15 @@
 
 ==========================
 
-The Treetracker Wallet Mobile App is a user-friendly interface for managing digital tokens.
+The Treetracker Wallet Mobile App is a user-friendly interface for managing
+digital tokens.
 
 ### Overview
 
 ---
 
-This app is built using Expo and React Native, and provides a secure and scalable way to manage digital tokens.
+This app is built using Expo and React Native, and provides a secure and
+scalable way to manage digital tokens.
 
 ### Features
 
@@ -37,7 +39,8 @@ cd apps/native
 yarn start
 ```
 
-This will start the app in development mode, and you can access it by scanning the QR code with your Expo Go app.
+This will start the app in development mode, and you can access it by scanning
+the QR code with your Expo Go app.
 
 ### Testing
 
@@ -47,7 +50,8 @@ This will start the app in development mode, and you can access it by scanning t
 
 We use Maestro for testing of our app:
 
-- **End-to-End Testing (E2E)**: Testing the entire application flow to ensure it works as expected, from start to finish.
+- **End-to-End Testing (E2E)**: Testing the entire application flow to ensure it
+  works as expected, from start to finish.
 
 ```bash
 yarn maestro test

apps/native/app/(auth)/login.tsx

@@ -1,3 +1,98 @@
-import LoginScreen from "@/screens/auth/Login.screen";
+import React, { useState } from "react";
+import {
+  View,
+  StyleSheet,
+  KeyboardAvoidingView,
+  Platform,
+  ScrollView,
+} from "react-native";
+import CustomTextInput from "@/components/ui/common/CustomTextInput";
+import CustomTitle from "@/components/ui/common/CustomTitle";
+import CustomSubmitButton from "@/components/ui/common/CustomSubmitButton";
 
-export default () => <LoginScreen />;
+const LoginScreen = () => {
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const isLoginEnabled = email.length > 0 && password.length > 0;
+  console.log(isLoginEnabled);
+
+  const handleLogIn = () => {};
+
+  return (
+    <KeyboardAvoidingView
+      behavior={Platform.OS === "ios" ? "padding" : "height"}
+      style={styles.keyboardContainer}>
+      <ScrollView contentContainerStyle={styles.scrollContainer}>
+        <CustomTitle title="Log In" />
+        <CustomTextInput
+          label="Email"
+          placeholder="Enter your email"
+          value={email}
+          onChangeText={setEmail}
+          keyboardType="email-address"
+          error={false}
+        />
+
+        <CustomTextInput
+          label="Password"
+          placeholder="Enter your password"
+          secureTextEntry
+          value={password}
+          onChangeText={setPassword}
+          error={false}
+        />
+
+        <View style={styles.buttonContainer}>
+          <CustomSubmitButton
+            title="log in"
+            onPress={handleLogIn}
+            disabled={isLoginEnabled}
+            style={
+              (isLoginEnabled ? styles.buttonActive : styles.buttonDisabled,
+              [{ textTransform: "uppercase" }])
+            }
+          />
+        </View>
+      </ScrollView>
+    </KeyboardAvoidingView>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: "white",
+  },
+  keyboardContainer: {
+    flex: 1,
+  },
+  scrollContainer: {
+    flex: 1,
+    justifyContent: "center",
+    paddingHorizontal: 20,
+  },
+
+  buttonContainer: {
+    paddingVertical: 13,
+    alignItems: "center",
+  },
+  buttonActive: {
+    backgroundColor: "#61892F",
+    paddingVertical: 15,
+    width: "100%",
+    alignItems: "center",
+  },
+  buttonDisabled: {
+    backgroundColor: "gray",
+    opacity: 0.5,
+    paddingVertical: 15,
+    width: "100%",
+    alignItems: "center",
+  },
+  buttonText: {
+    fontSize: 18,
+    fontWeight: "bold",
+    color: "white",
+  },
+});
+
+export default LoginScreen;