Migration/4 - Setup Project and updated the packages

.github/cra-template-build.yml

@@ -0,0 +1,34 @@
+name: E2E Tests
+
+on:
+  pull_request:
+    types:
+      - opened
+      - synchronize
+
+jobs:
+  unit_test:
+    image: node:18.4
+    stage: test
+    script:
+      - mkdir -p ~/bin/ && export PATH="~/bin/:$PATH"
+      - npm run jest:ci
+
+  e2e_tests:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 18.14.0
+
+      - name: Install Dependencies
+        run: npm install
+
+      - name: Run E2E Tests
+        run: npm run start:ci
+

.github/workflows/cra-template-build.yml

@@ -0,0 +1,62 @@
+name: Tests
+
+on:
+  pull_request:
+    types:
+      - opened
+      - synchronize
+
+jobs:
+  eslint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 18.14
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Code Linting
+        run: npm run lint
+
+  unit_test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 18.14
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Run unit tests
+        run: npm run jest:ci
+
+  e2e_tests:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 18.14
+
+      - name: Install Dependencies
+        run: npm install
+
+      - name: Run E2E Tests
+        run: npm run start:ci
+

template/gitignore → .gitignore

@@ -24,4 +24,4 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-.eslintcache
+.eslintcache

.gitlab-ci.yml

@@ -0,0 +1,30 @@
+stages:
+  - unit_test
+  - e2e_tests
+
+variables:
+  NODE_VERSION: "18.14"
+
+eslint:
+  stage: eslint
+  image: node:$NODE_VERSION
+  script:
+    - npm install
+    - npm run lint
+
+unit_test:
+  stage: unit_test
+  image: node:$NODE_VERSION
+  script:
+    - npm install
+    - npm run jest:ci
+
+e2e_tests:
+  stage: e2e_tests
+  image: node:$NODE_VERSION
+  script:
+    - npm install
+    - npm run start:ci
+
+only:
+  - merge_requests

CONTRIBUTING.md

@@ -0,0 +1,79 @@
+# Contributing to CRA Template Truemark
+
+Thank you for your interest in contributing to our project! We appreciate your interest in contributing.
+
+## How to Contribute
+
+### Ways of contribution for External Contributors {#forExternalContributors}
+
+- **Step 1**: 
+    Fork the Template: On GitHub, click "Fork" to create your own copy.
+
+- **Step 2**: 
+    Create a issue first if you are adding fixes for the template.
+
+- **Step 3**: 
+    Clone the forked repository to your local machine.
+
+    ```md 
+    git clone https://github.com/TruemarkDev/cra-template-truemark.git for https.
+
+    git clone [email protected]:TruemarkDev/cra-template-truemark.git for ssh.
+    ```
+
+- **Step 4**: 
+    Install dependencies using `npm install`.
+
+- **Step 5**: 
+    Start the project using `npm start`.
+
+- **Step 6**: 
+    Check out to a new branch.
+
+- **Step 7**: 
+    Make your changes and commit them.
+
+- **Step 8**: 
+    Push your changes to repository.
+
+- **Step 9**: 
+    Create a pull request with a clear title and description.
+
+### Ways of Contribution for Truemark's Members
+
+If you're a member of Truemark Technology, you can skip forking the project and proceed directly to step 3 of [Ways of contribution for External Contributors](#forExternalContributors)
+
+## Working with git
+
+- See the details on [guidelines to follow while working with git.](https://handbook.truemark.dev/docs/guidelines/git)
+
+## Update documentation for the changes made if needed
+
+If your changes affect the functionality of the library or introduce new features, please update the documentation to reflect these changes. This includes:
+
+-  Adding new library or updating the packages.
+-  Adding any new configuration options or usage instructions.
+
+## Creating a Pull Merge
+
+You need to create a PR properly. While creating a PR, you need to add the description of the tasks or features done. The PR must be marked as draft if all the task has not been completed and the remaining tasks needs to be mentioned in Remaining Tasks section as follows. Also, you can add the UI of the part of work done.
+
+```md
+
+Tasks Completed
+
+// Completed tasks
+
+Remaining Tasks
+
+// Remaining tasks if any
+
+Steps To Test Features
+
+// Steps that needs to be followed to test the feature
+
+Screenshots/Video
+
+// Media to show the UI of the task you performed
+
+```

Dockerfile

@@ -0,0 +1,25 @@
+ARG NODE_VERSION=18.14.0
+
+FROM node:${NODE_VERSION}-alpine
+
+# Set the working directory to /cra-template-truemark inside the container
+WORKDIR /cra-template-truemark
+
+# copy package.json file content
+COPY package*.json ./
+
+# Copy app files
+COPY . .
+
+# Install project dependencies
+RUN npm install
+
+# Create a batch script to run both npm start,cypress and unit tests
+RUN echo "@echo off" > C:\start-and-test.bat \
+    && echo "npm start" >> C:\start-and-test.bat \
+    && echo "npx cypress run" >> C:\start-and-test.bat \
+    && echo "npm test" >> C:\start-and-test.bat
+
+# Run the shell script
+CMD ["start-and-test"] 
+

README.md

@@ -0,0 +1,73 @@
+# Using cra-template-truemark
+
+## How can we install cra-template-truemark? - Step by Step Guide
+
+1. Clone using the following repo link
+
+   ```md
+   git clone https://github.com/TruemarkDev/cra-template-truemark.git for https.
+
+   git clone [email protected]:TruemarkDev/cra-template-truemark.git for ssh.
+
+   ```
+
+2. Go to the project folder
+
+   ```md
+   cd cra-template-truemark
+   ```
+
+## How can we run the project?
+
+In the project directory, you can run:
+
+   ```md
+   npm start
+   ```
+
+Runs the app in the development mode.
+ Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
+
+The page will reload when you make changes.
+You may also see any lint errors in the console.
+
+## Updating Remote Origin URL to that of the Project
+
+When setting up your local development environment for your project, you need to follow these steps:
+
+1. Navigate to your local project directory using the terminal.
+2. Check the current remote URLs associated with your repository by running:
+
+```
+git remote -v
+
+```
+3. To update the remote origin URL, use the following command, replacing `<new_repo_url>` with the URL of the new project repository by using following command:
+
+```
+git remote set-url origin <new_repo_url>
+
+```
+4. Verify that the remote origin URL has been updated by running `git remote -v` again. It should now point to the new project repository.
+
+## Dependencies
+
+- **React:** ^18.2.0
+- **Node.js:** 18.14.0
+- **npm:** 9.8.1
+
+## What are libraries and stack used within template?
+
+- **React:** For building dynamic user interfaces.
+- **Routing:** Utilize react-router-dom for navigation.
+- **Localization:** i18next simplifies translations.
+- **HTTP Requests:** axios for API interactions.
+- **Styling:** Bootstrap ensures responsive designs.
+- **Icons:** Integrate Font Awesome for customizable icons.
+- **Testing:** @testing-library for unit testing and cypress for end-to-end testing.
+- **Linting & Formatting:** eslint, Prettier, stylelint.
+- **CSS Enhancement:** Leverage Sass for powerful styling.
+
+## How can I contribute?
+
+To find information on how to contribute to the project, you can usually refer to the CONTRIBUTING.md file in project's repository. This file provides guidelines and instructions for contributing to our project.

cypress.config.js

@@ -0,0 +1,9 @@
+const { defineConfig } = require("cypress");
+
+module.exports = defineConfig({
+  e2e: {
+    setupNodeEvents() {
+      // implement node event listeners here
+    },
+  },
+});

cypress/e2e/spec.cy.js

@@ -0,0 +1,5 @@
+describe('template spec', () => {
+   it("shows true as true", () => {
+     expect(true).to.equal(true);
+   });
+})

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "[email protected]",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

cypress/support/commands.js

@@ -0,0 +1,25 @@
+// ***********************************************
+// This example commands.js shows you how to
+// create various custom commands and overwrite
+// existing commands.
+//
+// For more comprehensive examples of custom
+// commands please read more here:
+// https://on.cypress.io/custom-commands
+// ***********************************************
+//
+//
+// -- This is a parent command --
+// Cypress.Commands.add('login', (email, password) => { ... })
+//
+//
+// -- This is a child command --
+// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
+//
+//
+// -- This is a dual command --
+// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
+//
+//
+// -- This will overwrite an existing command --
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })

cypress/support/e2e.js

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/e2e.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')