Integrate Redux + Add Authentication flow

Author: aayushgupta05

.env

@@ -0,0 +1 @@
+GRAPHQL_API_ENDPOINT = "http://127.0.0.1:8000"

README.md

@@ -1 +1 @@
-# community-forum-frontend
+# Spansberry Frontend

package-lock.json

@@ -1,15 +1,20 @@
 {
- "name": "community-forum-frontend",
+ "name": "spansberry-frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
  "@material-ui/core": "^4.10.2",
+ "@reduxjs/toolkit": "^1.4.0",
  "@testing-library/jest-dom": "^4.2.4",
  "@testing-library/react": "^9.3.2",
  "@testing-library/user-event": "^7.1.2",
  "@tinymce/tinymce-react": "^3.6.0",
+ "axios": "^0.21.0",
+ "bootstrap": "^4.5.3",
+ "dotenv": "^8.2.0",
  "draft-js": "^0.11.6",
  "html-react-parser": "^0.13.0",
+ "joi": "^17.3.0",
  "node-sass": "^4.14.1",
  "react": "^16.13.1",
  "react-beautiful-dnd": "^13.0.0",
@@ -18,9 +23,12 @@
  "react-html-parser": "^2.0.2",
  "react-icons": "^3.10.0",
  "react-markdown-renderer": "^1.4.0",
+ "react-redux": "^7.2.2",
  "react-router-dom": "^5.2.0",
  "react-scripts": "3.4.1",
  "react-tagsinput": "^3.19.0",
+ "redux": "^4.0.5",
+ "redux-thunk": "^2.3.0",
  "remarkable": "^2.0.1",
  "socket.io-client": "^2.3.0"
  },

package.json

@@ -1,16 +1,10 @@
 import React from "react";
-import "./App.css";
 import Router from "./router";
 
 function App() {
  return (
  <React.Fragment>
- <link
- rel="stylesheet"
- href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
- integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
- crossorigin="anonymous"
- />
+ {/* Navbar component to be added */}
  <Router />
  </React.Fragment>
  );

src/App.js

@@ -1,3 +1,15 @@
+body {
+ margin: 0;
+ font-family: 'Inter', sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+ font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+ monospace;
+}
+
 .App {
  text-align: center;
 }
@@ -37,3 +49,31 @@
  transform: rotate(360deg);
  }
 }
+
+//buttons
+.primary-button {
+ background-color: $primary-button;
+ margin-top: 15px;
+ padding: 8px 25px;
+}
+
+//alerts
+.alert {
+ color: $error-red;
+ font-weight: 500;
+}
+
+//forms
+.form-group {
+ label {
+ color: $form-label;
+ font-size: 1rem;
+ font-weight: 500;
+ padding-top: 1rem;
+ }
+}
+
+.form-field-error {
+ color: $error-red;
+ padding-top: 0.5rem;
+}

src/App.css renamed to src/App.scss

@@ -0,0 +1,3 @@
+.login-form {
+ padding: 15px;
+}