boolean-uk · Elizabethcodes44 · Feb 6, 2024 · Feb 6, 2024 · Feb 6, 2024 · Feb 6, 2024
diff --git a/.env.example b/.env.example
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -0,0 +1,12 @@
+name: CI
+on: [push, pull_request]
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 'lts/*'
+      - run: npm ci
+      - run: npm run lint
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,6 @@
+{
+    "trailingComma": "es5",
+    "tabWidth": 2,
+    "semi": false,
+    "singleQuote": false
+}
diff --git a/README.md b/README.md
@@ -11,7 +11,7 @@ Client repository for team dev project.
 
 ### Project Management
 
-https://github.com/orgs/boolean-uk/projects/10/views/1
+https://trello.com/invite/b/3cEAMjKi/ATTIe60126493eaf9bd46a14b18c431c3e11EE7E5E20/team-dev-c11
 
 ### Contributing
 

diff --git a/jsconfig.json b/jsconfig.json
@@ -0,0 +1,5 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx"
+  }
+}
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -6,19 +6,33 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^13.4.0",
     "@testing-library/user-event": "^14.4.3",
+    "i18next": "^23.8.2",
     "jwt-decode": "^3.1.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-i18next": "^14.0.5",
     "react-modal": "^3.16.1",
     "react-router-dom": "^6.8.0",
     "react-scripts": "5.0.1",
     "web-vitals": "^3.1.1"
   },
+  "devDependencies": {
+    "eslint": "^8.56.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-config-react-app": "^7.0.1",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-node": "^11.1.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-promise": "^6.1.1",
+    "prettier": "^3.2.5"
+  },
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "eject": "react-scripts eject",
+    "lint": "eslint src"
   },
   "eslintConfig": {
     "extends": [

diff --git a/src/App.css b/src/App.css
@@ -1,16 +1,23 @@
 * {
-    color: #000046;
+  color: #000046;
 }
 
 .container {
-    display: grid;
-    grid-template-columns: 151px 2fr 1fr;
-    grid-template-rows: 96px auto;
-    background-color: #F0F5FA;
-    height: 100vh;
+  position: relative;
+  display: grid;
+  grid-template-columns: 151px 2fr 1fr;
+  grid-template-rows: 96px auto;
+  background-color: #f0f5fa;
+  min-height: 100vh;
 }
 
 .ReactModal__Body--open,
 .ReactModal__Html--open {
   overflow: hidden;
-}
+}
+
+.input-message {
+  color: red;
+  font-size: 18px;
+  text-align: center;
+}
diff --git a/src/App.js b/src/App.js
@@ -1,46 +1,66 @@
-import "./App.css";
-import { Routes, Route } from "react-router-dom";
-import Dashboard from "./pages/dashboard";
-import Login from "./pages/login";
-import Register from "./pages/register";
-import Loading from "./pages/loading";
-import Verification from "./pages/verification";
-import { AuthProvider, ProtectedRoute } from "./context/auth";
-import { ModalProvider } from "./context/modal";
-import Welcome from "./pages/welcome";
+import "./App.css"
+import { Routes, Route } from "react-router-dom"
+import Dashboard from "./pages/dashboard"
+import Login from "./pages/login"
+import Register from "./pages/register"
+import Loading from "./pages/loading"
+import Verification from "./pages/verification"
+import { AuthProvider, ProtectedRoute } from "./context/auth"
+import { ModalProvider } from "./context/modal"
+import Welcome from "./pages/welcome"
+import MyCohort from "./pages/myCohort"
+import UserSearchResult from "./pages/UserSearchResult"
 
 const App = () => {
-	return (
-		<>
-			<AuthProvider>
-                <ModalProvider>
-                    <Routes>
-                        <Route path="login" element={<Login />} />
-                        <Route path="register" element={<Register />} />
-                        <Route path="loading" element={<Loading />} />
-                        <Route path="verification" element={<Verification />} />
+  return (
+    <>
+      <AuthProvider>
+        <ModalProvider>
+          <Routes>
+            <Route path="login" element={<Login />} />
+            <Route path="register" element={<Register />} />
+            <Route path="loading" element={<Loading />} />
+            <Route path="verification" element={<Verification />} />
 
-                        <Route
-                            index
-                            element={
-                                <ProtectedRoute>
-                                    <Dashboard />
-                                </ProtectedRoute>
-                            }
-                        />
-                        <Route
-                            path="welcome"
-                            element={
-                                <ProtectedRoute disabledNav={true}>
-                                    <Welcome />
-                                </ProtectedRoute>
-                            }
-                        />
-                    </Routes>
-                </ModalProvider>
-			</AuthProvider>
-		</>
-	);
-};
+            <Route
+              index
+              element={
+                <ProtectedRoute>
+                  <Dashboard />
+                </ProtectedRoute>
+              }
+            />
 
-export default App;
+            <Route
+              path="my-cohort"
+              element={
+                <ProtectedRoute>
+                  <MyCohort />
+                </ProtectedRoute>
+              }
+            />
+
+            <Route
+              path="results"
+              element={
+                <ProtectedRoute>
+                  <UserSearchResult />
+                </ProtectedRoute>
+              }
+            />
+            <Route
+              path="welcome"
+              element={
+                <ProtectedRoute disabledNav={true}>
+                  <Welcome />
+                </ProtectedRoute>
+              }
+            />
+          </Routes>
+        </ModalProvider>
+      </AuthProvider>
+    </>
+  )
+}
+
+export default App
diff --git a/src/App.test.js b/src/App.test.js
@@ -1,7 +1,7 @@
-import { render, screen } from '@testing-library/react';
-import App from './App';
+import { render, screen } from "@testing-library/react";
+import App from "./App";
 
-test('renders learn react link', () => {
+test("renders learn react link", () => {
   render(<App />);
   const linkElement = screen.getByText(/learn react/i);
   expect(linkElement).toBeInTheDocument();

diff --git a/src/assets/fullLogo-whiteLines.js b/src/assets/fullLogo-whiteLines.js
diff --git a/src/assets/fullLogo.js b/src/assets/fullLogo.js
diff --git a/src/assets/icons/addIcon.js b/src/assets/icons/addIcon.js
@@ -1,18 +1,18 @@
 const AddIcon = () => {
-	return (
-		<svg
-			width="32"
-			height="40"
-			viewBox="0 0 32 40"
-			fill="none"
-			xmlns="http://www.w3.org/2000/svg"
-		>
-			<path
-				d="M14.5 32.3H17.5V25.85H24V22.85H17.5V16.35H14.5V22.85H8V25.85H14.5V32.3ZM3 40C2.2 40 1.5 39.7 0.9 39.1C0.3 38.5 0 37.8 0 37V3C0 2.2 0.3 1.5 0.9 0.9C1.5 0.3 2.2 0 3 0H21.05L32 10.95V37C32 37.8 31.7 38.5 31.1 39.1C30.5 39.7 29.8 40 29 40H3ZM19.55 12.3V3H3V37H29V12.3H19.55ZM3 3V12.3V3V37V3Z"
-				fill="#64648C"
-			/>
-		</svg>
-	);
+  return (
+    <svg
+      width="32"
+      height="40"
+      viewBox="0 0 32 40"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M14.5 32.3H17.5V25.85H24V22.85H17.5V16.35H14.5V22.85H8V25.85H14.5V32.3ZM3 40C2.2 40 1.5 39.7 0.9 39.1C0.3 38.5 0 37.8 0 37V3C0 2.2 0.3 1.5 0.9 0.9C1.5 0.3 2.2 0 3 0H21.05L32 10.95V37C32 37.8 31.7 38.5 31.1 39.1C30.5 39.7 29.8 40 29 40H3ZM19.55 12.3V3H3V37H29V12.3H19.55ZM3 3V12.3V3V37V3Z"
+        fill="#64648C"
+      />
+    </svg>
+  );
 };
 
 export default AddIcon;
diff --git a/src/assets/icons/arrowRightIcon.js b/src/assets/icons/arrowRightIcon.js
@@ -1,15 +1,15 @@
 const ArrowRightIcon = () => {
-	return (
-		<svg
-			width="10"
-			height="20"
-			viewBox="0 0 10 20"
-			fill="none"
-			xmlns="http://www.w3.org/2000/svg"
-		>
-			<path d="M0 20V0L10 10L0 20Z" fill="#000046" />
-		</svg>
-	);
+  return (
+    <svg
+      width="10"
+      height="20"
+      viewBox="0 0 10 20"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path d="M0 20V0L10 10L0 20Z" fill="#000046" />
+    </svg>
+  );
 };
 
 export default ArrowRightIcon;
diff --git a/src/assets/icons/backArrowIcon.js b/src/assets/icons/backArrowIcon.js
@@ -0,0 +1,27 @@
+import React from "react"
+
+const BackArrowIcon = ({ width, height, top, left, color }) => {
+  const svgStyle = {
+    width,
+    height,
+    top,
+    left,
+    color,
+  }
+
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      style={svgStyle}
+      stroke="#64648C"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    >
+      <path d="M19 12H5M12 19l-7-7 7-7" />
+    </svg>
+  )
+}
+
+export default BackArrowIcon
diff --git a/src/assets/icons/cogIcon.js b/src/assets/icons/cogIcon.js
diff --git a/src/assets/icons/cohortIcon-fill.js b/src/assets/icons/cohortIcon-fill.js
@@ -1,18 +1,18 @@
 const CohortIconFill = () => {
-	return (
-		<svg
-			width="46"
-			height="32"
-			viewBox="0 0 46 32"
-			fill="none"
-			xmlns="http://www.w3.org/2000/svg"
-		>
-			<path
-				d="M0.899902 32.0002V27.3002C0.899902 26.1335 1.1999 25.0752 1.7999 24.1252C2.3999 23.1752 3.23324 22.4669 4.2999 22.0002C6.73324 20.9335 8.9249 20.1669 10.8749 19.7002C12.8249 19.2335 14.8332 19.0002 16.8999 19.0002C18.9666 19.0002 20.9666 19.2335 22.8999 19.7002C24.8332 20.1669 27.0166 20.9335 29.4499 22.0002C30.5166 22.4669 31.3582 23.1752 31.9749 24.1252C32.5916 25.0752 32.8999 26.1335 32.8999 27.3002V32.0002H0.899902ZM35.8999 32.0002V27.3002C35.8999 25.2002 35.3666 23.4752 34.2999 22.1252C33.2332 20.7752 31.8332 19.6835 30.0999 18.8502C32.3999 19.1169 34.5666 19.5085 36.5999 20.0252C38.6332 20.5419 40.2832 21.1335 41.5499 21.8002C42.6499 22.4335 43.5166 23.2169 44.1499 24.1502C44.7832 25.0835 45.0999 26.1335 45.0999 27.3002V32.0002H35.8999ZM16.8999 15.9502C14.6999 15.9502 12.8999 15.2502 11.4999 13.8502C10.0999 12.4502 9.3999 10.6502 9.3999 8.4502C9.3999 6.2502 10.0999 4.4502 11.4999 3.0502C12.8999 1.6502 14.6999 0.950195 16.8999 0.950195C19.0999 0.950195 20.8999 1.6502 22.2999 3.0502C23.6999 4.4502 24.3999 6.2502 24.3999 8.4502C24.3999 10.6502 23.6999 12.4502 22.2999 13.8502C20.8999 15.2502 19.0999 15.9502 16.8999 15.9502ZM34.8999 8.4502C34.8999 10.6502 34.1999 12.4502 32.7999 13.8502C31.3999 15.2502 29.5999 15.9502 27.3999 15.9502C27.0332 15.9502 26.6249 15.9252 26.1749 15.8752C25.7249 15.8252 25.3166 15.7335 24.9499 15.6002C25.7499 14.7669 26.3582 13.7419 26.7749 12.5252C27.1916 11.3085 27.3999 9.9502 27.3999 8.4502C27.3999 6.9502 27.1916 5.6252 26.7749 4.4752C26.3582 3.3252 25.7499 2.26686 24.9499 1.3002C25.3166 1.2002 25.7249 1.11686 26.1749 1.0502C26.6249 0.983529 27.0332 0.950195 27.3999 0.950195C29.5999 0.950195 31.3999 1.6502 32.7999 3.0502C34.1999 4.4502 34.8999 6.2502 34.8999 8.4502Z"
-				fill="#000046"
-			/>
-		</svg>
-	);
+  return (
+    <svg
+      width="46"
+      height="32"
+      viewBox="0 0 46 32"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M0.899902 32.0002V27.3002C0.899902 26.1335 1.1999 25.0752 1.7999 24.1252C2.3999 23.1752 3.23324 22.4669 4.2999 22.0002C6.73324 20.9335 8.9249 20.1669 10.8749 19.7002C12.8249 19.2335 14.8332 19.0002 16.8999 19.0002C18.9666 19.0002 20.9666 19.2335 22.8999 19.7002C24.8332 20.1669 27.0166 20.9335 29.4499 22.0002C30.5166 22.4669 31.3582 23.1752 31.9749 24.1252C32.5916 25.0752 32.8999 26.1335 32.8999 27.3002V32.0002H0.899902ZM35.8999 32.0002V27.3002C35.8999 25.2002 35.3666 23.4752 34.2999 22.1252C33.2332 20.7752 31.8332 19.6835 30.0999 18.8502C32.3999 19.1169 34.5666 19.5085 36.5999 20.0252C38.6332 20.5419 40.2832 21.1335 41.5499 21.8002C42.6499 22.4335 43.5166 23.2169 44.1499 24.1502C44.7832 25.0835 45.0999 26.1335 45.0999 27.3002V32.0002H35.8999ZM16.8999 15.9502C14.6999 15.9502 12.8999 15.2502 11.4999 13.8502C10.0999 12.4502 9.3999 10.6502 9.3999 8.4502C9.3999 6.2502 10.0999 4.4502 11.4999 3.0502C12.8999 1.6502 14.6999 0.950195 16.8999 0.950195C19.0999 0.950195 20.8999 1.6502 22.2999 3.0502C23.6999 4.4502 24.3999 6.2502 24.3999 8.4502C24.3999 10.6502 23.6999 12.4502 22.2999 13.8502C20.8999 15.2502 19.0999 15.9502 16.8999 15.9502ZM34.8999 8.4502C34.8999 10.6502 34.1999 12.4502 32.7999 13.8502C31.3999 15.2502 29.5999 15.9502 27.3999 15.9502C27.0332 15.9502 26.6249 15.9252 26.1749 15.8752C25.7249 15.8252 25.3166 15.7335 24.9499 15.6002C25.7499 14.7669 26.3582 13.7419 26.7749 12.5252C27.1916 11.3085 27.3999 9.9502 27.3999 8.4502C27.3999 6.9502 27.1916 5.6252 26.7749 4.4752C26.3582 3.3252 25.7499 2.26686 24.9499 1.3002C25.3166 1.2002 25.7249 1.11686 26.1749 1.0502C26.6249 0.983529 27.0332 0.950195 27.3999 0.950195C29.5999 0.950195 31.3999 1.6502 32.7999 3.0502C34.1999 4.4502 34.8999 6.2502 34.8999 8.4502Z"
+        fill="#000046"
+      />
+    </svg>
+  );
 };
 
 export default CohortIconFill;