diff --git a/backend/deploy/Dockerfile b/backend/deploy/Dockerfile
deleted file mode 100644
index 73d40a66..00000000
--- a/backend/deploy/Dockerfile
+++ /dev/null
@@ -1,14 +0,0 @@
-FROM tiangolo/uvicorn-gunicorn-fastapi:python3.11
-
-ENV APP_MODULE=src.main:app
-ENV PORT=8000
-
-WORKDIR /backend
-
-COPY ../requirements.txt /backend/requirements.txt
-
-RUN pip install --no-cache-dir --upgrade -r /backend/requirements.txt
-
-COPY ../ /backend
-
-CMD [ "/start-reload.sh" ]
diff --git a/backend/src/constants.py b/backend/src/constants.py
index a38f3f3a..4d43f61f 100644
--- a/backend/src/constants.py
+++ b/backend/src/constants.py
@@ -3,7 +3,6 @@
# GLOBAL
LOCAL = os.getenv("LOCAL", "False") == "True"
PROD = os.getenv("PROD", "False") == "True"
-DOCKER = os.getenv("DOCKER", "False") == "True"
PROJECT_ID = "github-334619"
BACKEND_URL = "https://api.githubtrends.io" if PROD else "http://localhost:8000"
diff --git a/backend/src/main.py b/backend/src/main.py
index c5942ace..07df7095 100644
--- a/backend/src/main.py
+++ b/backend/src/main.py
@@ -28,8 +28,11 @@
origins = [
"http://localhost:3000",
+ "http://localhost:3001",
"https://githubtrends.io",
"https://www.githubtrends.io",
+ "https://githubwrapped.io",
+ "https://www.githubwrapped.io",
]
app.add_middleware(
diff --git a/docker-compose.yaml b/docker-compose.yaml
deleted file mode 100644
index 8d06466a..00000000
--- a/docker-compose.yaml
+++ /dev/null
@@ -1,30 +0,0 @@
-version: "3"
-
-services:
- backend:
- container_name: backend
- build:
- context: "./backend"
- dockerfile: deploy/Dockerfile
- ports:
- - 8000:8000
- volumes:
- - ./backend:/backend
- environment:
- - GOOGLE_APPLICATION_CREDENTIALS=/backend/gcloud_key.json
- - PROJECT_ID=github-334619
- - DOCKER=True
-
- frontend:
- container_name: frontend
- build:
- context: "./frontend"
- dockerfile: deploy/Dockerfile
- ports:
- - "3000:3000"
- volumes:
- - ./frontend:/frontend
- environment:
- - CHOKIDAR_USEPOLLING=true
- depends_on:
- - backend
diff --git a/docs/CONTRIBUTING.md b/docs/CONTRIBUTING.md
index 6249a40d..ae0eaaa7 100644
--- a/docs/CONTRIBUTING.md
+++ b/docs/CONTRIBUTING.md
@@ -6,14 +6,6 @@ If you are interested in contributing to GitHub Trends, take a look through the
First, copy `backend/.env-template` into `backend/.env` and fill in the missing variables. Similarly, copy `frontend/.env-template` into `frontend/.env` and fill in the missing variables. Create a Google Cloud Platform service account and include the key in `backend/gcloud_key.json`. Then run:
-### Docker (recommended)
-
-```
-docker-compose up --build -d
-```
-
-### Manual
-
With Python3.11, install the dependencies from `backend/requirements.txt` and run `yarn start`.
With Node16 and Yarn, install the dependencies from `frontend/package.json` and run on a separate terminal window `yarn start`.
diff --git a/frontend/.dockerignore b/frontend/.dockerignore
deleted file mode 100644
index 98f0099b..00000000
--- a/frontend/.dockerignore
+++ /dev/null
@@ -1,3 +0,0 @@
-deploy/Dockerfile
-.dockerignore
-node_modules
\ No newline at end of file
diff --git a/frontend/package.json b/frontend/package.json
index 781100dc..ae608665 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -47,7 +47,8 @@
"tailwindcss": "^3.3.5"
},
"scripts": {
- "start": "react-scripts start",
+ "trends": "REACT_APP_MODE=trends react-scripts start",
+ "wrapped": "REACT_APP_MODE=wrapped PORT=3001 react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
diff --git a/frontend/src/api/wrapped.js b/frontend/src/api/wrapped.js
index 0113a04a..58d21bd6 100644
--- a/frontend/src/api/wrapped.js
+++ b/frontend/src/api/wrapped.js
@@ -2,9 +2,9 @@
import axios from 'axios';
-import { SUBSCRIBER_URL } from '../constants';
+import { BACKEND_URL } from '../constants';
-const URL_PREFIX = `${SUBSCRIBER_URL}/wrapped`;
+const URL_PREFIX = `${BACKEND_URL}/wrapped`;
const getValidUser = async (userId) => {
try {
diff --git a/frontend/src/constants.js b/frontend/src/constants.js
index 4db49281..ceae357a 100644
--- a/frontend/src/constants.js
+++ b/frontend/src/constants.js
@@ -1,3 +1,4 @@
+/* eslint-disable no-nested-ternary */
export const PROD = process.env.REACT_APP_PROD === 'true';
export const USE_LOGGER = true;
@@ -6,17 +7,25 @@ export const CLIENT_ID = PROD
? process.env.REACT_APP_PROD_CLIENT_ID
: process.env.REACT_APP_DEV_CLIENT_ID;
+export const MODE = process.env.REACT_APP_MODE;
+
export const REDIRECT_URI = PROD
- ? 'https://www.githubtrends.io/user'
- : 'http://localhost:3000/user';
+ ? MODE === 'trends'
+ ? 'https://www.githubtrends.io/user'
+ : 'https://www.githubtrends.io/user/wrapped'
+ : MODE === 'trends'
+ ? 'http://localhost:3000/user'
+ : 'http://localhost:3000/user/wrapped';
+
+console.log(REDIRECT_URI);
export const GITHUB_PRIVATE_AUTH_URL = `https://github.com/login/oauth/authorize?scope=user,repo&client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URI}/private`;
export const GITHUB_PUBLIC_AUTH_URL = `https://github.com/login/oauth/authorize?client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URI}/public`;
+export const WRAPPED_URL = PROD
+ ? 'https://www.githubwrapped.io'
+ : 'http://localhost:3001';
+
export const BACKEND_URL = PROD
? 'https://api.githubtrends.io'
: 'http://localhost:8000';
-
-export const SUBSCRIBER_URL = PROD
- ? 'https://github-334619.uc.r.appspot.com'
- : 'http://localhost:8000';
diff --git a/frontend/src/index.js b/frontend/src/index.js
index d98fca96..68fafa98 100644
--- a/frontend/src/index.js
+++ b/frontend/src/index.js
@@ -3,15 +3,30 @@ import ReactDOM from 'react-dom/client';
import { Provider } from 'react-redux';
import configureStore from './redux/store';
-import App from './pages/App';
+import { AppTrends, AppWrapped } from './pages/App';
import './index.css';
+import { MODE } from './constants';
+
export const store = configureStore();
const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(
-
Personalization
+Coming soon!
+Delete Account
diff --git a/frontend/src/pages/Wrapped/SelectUser.js b/frontend/src/pages/Wrapped/SelectUser.js index 9e532650..8a3cc59a 100644 --- a/frontend/src/pages/Wrapped/SelectUser.js +++ b/frontend/src/pages/Wrapped/SelectUser.js @@ -2,7 +2,7 @@ /* eslint-disable no-unused-vars */ import React, { useState, useEffect } from 'react'; -import { useSelector } from 'react-redux'; +import { useDispatch, useSelector } from 'react-redux'; import { useNavigate, Link } from 'react-router-dom'; import { ClipLoader } from 'react-spinners'; @@ -15,6 +15,9 @@ import { classnames, sleep } from '../../utils'; import wrapped1 from '../../assets/wrapped1.png'; import wrapped2 from '../../assets/wrapped2.png'; import wrapped3 from '../../assets/wrapped3.png'; +import { PROD } from '../../constants'; +import { authenticate, setUserKey } from '../../api'; +import { login as _login } from '../../redux/actions/userActions'; const SelectUserScreen = () => { const userId = useSelector((state) => state.user.userId || ''); @@ -22,6 +25,7 @@ const SelectUserScreen = () => { const [userName, setUserName] = useState(userId); const navigate = useNavigate(); + const dispatch = useDispatch(); let userNameInput; @@ -29,6 +33,33 @@ const SelectUserScreen = () => { userNameInput.focus(); }, [userNameInput]); + const login = (newUserId, userKey) => dispatch(_login(newUserId, userKey)); + + useEffect(() => { + async function redirectCode() { + // After requesting Github access, Github redirects back to your app with a code parameter + const url = window.location.href; + + if (url.includes('error=')) { + navigate('/'); + } + + // If Github API returns the code parameter + if (url.includes('code=')) { + const tempPrivateAccess = url.includes('private'); + const newUrl = url.split('?code='); + const subStr = PROD ? 'githubwrapped.io' : 'localhost:3001'; + const redirect = `${url.split(subStr)[0]}${subStr}/`; + window.history.pushState({}, null, redirect); + const userKey = await setUserKey(newUrl[1]); + const newUserId = await authenticate(newUrl[1], tempPrivateAccess); + login(newUserId, userKey); + } + } + + redirectCode(); + }, []); + const [error, setError] = useState(''); const [isLoading, setIsLoading] = useState(false); @@ -37,7 +68,7 @@ const SelectUserScreen = () => { const validUser = await getValidUser(userName); if (validUser === 'Valid user') { await sleep(100); - navigate(`/wrapped/${userName}`); + navigate(`/${userName}`); } else if (validUser === 'GitHub user not found') { setError('GitHub user not found. Check your spelling and try again.'); } else if (validUser === 'Repo not starred') { @@ -175,7 +206,7 @@ const SelectUserScreen = () => { }, ].map((user) => (