@@ -22,6 +22,7 @@ import { Login } from "./components/auth/Login"; | |||
import { Signup } from "./components/auth/Signup"; | |||
export const SERVER_URL = 'http://localhost:8001'; | |||
export const API_TOKEN = { "Authorization": `Bearer ${localStorage.anamnesisToken}` } | |||
export var userProfileData: IProfile = { | |||
@@ -4,15 +4,8 @@ import { ReactComponent as LogoIcon } from '../../assets/icons/anamnesis.svg'; | |||
import { ReactComponent as EyeOffIcon } from '../../assets/icons/eye-off-outline.svg'; | |||
import { ReactComponent as EyeIcon } from '../../assets/icons/eye-outline.svg'; | |||
import { NavLink } from "react-router-dom"; | |||
import axios from 'axios'; | |||
import { SERVER_URL } from "../../App"; | |||
export const authenticateCredentials = async (username: string, password: string) => { | |||
return await axios.post(SERVER_URL + '/auth/api-auth/', { | |||
email: username, | |||
password: password | |||
}); | |||
} | |||
import { authenticateCredentials } from "../../services/auth"; | |||
export const Login: React.FC = () => { | |||
const [showPassowrd, setShowPassword] = useState<boolean>(true); | |||
@@ -6,7 +6,8 @@ import { ReactComponent as EyeIcon } from '../../assets/icons/eye-outline.svg'; | |||
import { NavLink } from "react-router-dom"; | |||
import axios from 'axios'; | |||
import { SERVER_URL } from "../../App"; | |||
import { authenticateCredentials } from "./Login"; | |||
import { authenticateCredentials } from "../../services/auth"; | |||
const registerUser = async (name: string, username: string, password: string) => { | |||
@@ -16,11 +16,27 @@ import { NavLink } from "react-router-dom"; | |||
import { AddCategory } from "../add-category/AddCategory"; | |||
import { useHistory } from "react-router-dom"; | |||
import { userProfileData } from "../../App"; | |||
import { addCategory, getCategory, updateCategory } from "../../services/category"; | |||
import { getUserProfile } from "../../services/user"; | |||
import { getWordResult } from "../../services/words"; | |||
export const Home: React.FC = () => { | |||
const [isAddCategoryPopupOpen, setAddCategoryPopupState] = useState<Boolean>(false); | |||
const history = useHistory(); | |||
getUserProfile().then((data) => { | |||
console.log("UserProfile", data) | |||
}, (err) => { | |||
console.log(err) | |||
}) | |||
getWordResult('Ple').then((data) => { | |||
console.log("Words", data.data) | |||
}, (err) => { | |||
console.log(err) | |||
}) | |||
return <section className="page"> | |||
<header className={styles.pageHeader}> | |||
@@ -28,8 +44,8 @@ export const Home: React.FC = () => { | |||
</header> | |||
<section className={styles.upfold}> | |||
<div className={styles.profileImage}> | |||
<CircularProgressbar value={70} strokeWidth={4} | |||
<div className={styles.profileImage}> | |||
<CircularProgressbar value={70} strokeWidth={4} | |||
styles={{ | |||
path: { | |||
stroke: '#d45b63', | |||
@@ -38,11 +54,12 @@ export const Home: React.FC = () => { | |||
trail: { | |||
stroke: 'rgba(255, 255, 255, 0)', | |||
strokeLinecap: 'round', | |||
}} | |||
} | |||
} | |||
} /> | |||
{/* eslint-disable-next-line */} | |||
<img src="https://www.lakecountyin.org/images/user-icon-placeholder.png" alt="profile-image" /> | |||
{ userProfileData.medal.icon } | |||
{userProfileData.medal.icon} | |||
</div> | |||
<div className={styles.userDetails}> | |||
<h2> Neymar Junior </h2> | |||
@@ -114,13 +131,13 @@ export const Home: React.FC = () => { | |||
</NavLink> | |||
</header> | |||
<ul> | |||
{ userProfileData.categories.map((category, categoryIndex) => { | |||
{userProfileData.categories.map((category, categoryIndex) => { | |||
return category.shelves.map((shelf, shelfIndex) => { | |||
return <li key={shelf.name} onClick={ () => { | |||
return <li key={shelf.name} onClick={() => { | |||
history.push('/shelf-details/category_id=' + categoryIndex + '&&shelf_id=' + shelfIndex); | |||
} }> | |||
}}> | |||
<div className={styles.progress}> | |||
<CircularProgressbar value={shelf.words.length > 0 ? (shelf.revisedWords.length * 100/ shelf.words.length) : 0} strokeWidth={7} | |||
<CircularProgressbar value={shelf.words.length > 0 ? (shelf.revisedWords.length * 100 / shelf.words.length) : 0} strokeWidth={7} | |||
styles={{ | |||
path: { | |||
stroke: 'white', | |||
@@ -129,17 +146,18 @@ export const Home: React.FC = () => { | |||
trail: { | |||
stroke: 'rgba(255, 255, 255, 0.25)', | |||
strokeLinecap: 'round', | |||
}} | |||
} | |||
} | |||
} /> | |||
<span className={styles.text}> { shelf.words.length > 0 ? (shelf.revisedWords.length * 100/ shelf.words.length) : 0 }% </span> | |||
<span className={styles.text}> {shelf.words.length > 0 ? (shelf.revisedWords.length * 100 / shelf.words.length) : 0}% </span> | |||
</div> | |||
<h5> { shelf.name } </h5> | |||
<p> { shelf.words.length } words </p> | |||
<p> { category.name } </p> | |||
<h5> {shelf.name} </h5> | |||
<p> {shelf.words.length} words </p> | |||
<p> {category.name} </p> | |||
</li> | |||
}) | |||
}) } | |||
})} | |||
</ul> | |||
</section> | |||
@@ -157,22 +175,22 @@ export const Home: React.FC = () => { | |||
</button> | |||
</header> | |||
<ul> | |||
{ userProfileData.categories.map((category, index) => { | |||
{userProfileData.categories.map((category, index) => { | |||
return <li key={category.name} onClick={() => { | |||
history.push('/category-details/category_id=' + index); | |||
}}> | |||
<div className={styles.icon}> | |||
{ category.icon } | |||
{category.icon} | |||
</div> | |||
<div className={styles.info}> | |||
<label> { category.name } </label> | |||
<span> { category.shelves.length } Shelves </span> | |||
<label> {category.name} </label> | |||
<span> {category.shelves.length} Shelves </span> | |||
</div> | |||
</li> | |||
})} | |||
})} | |||
</ul> | |||
</section> | |||
{ isAddCategoryPopupOpen && <AddCategory hidePopup={() => setAddCategoryPopupState(false)} /> } | |||
{isAddCategoryPopupOpen && <AddCategory hidePopup={() => setAddCategoryPopupState(false)} />} | |||
</section> | |||
} |
@@ -0,0 +1,9 @@ | |||
import axios from "axios"; | |||
import { SERVER_URL } from "../App"; | |||
export const authenticateCredentials = async (username: string, password: string) => { | |||
return await axios.post(SERVER_URL + '/auth/api-auth/', { | |||
email: username, | |||
password: password | |||
}); | |||
} |
@@ -0,0 +1,31 @@ | |||
import axios from "axios"; | |||
import { API_TOKEN, SERVER_URL } from "../App"; | |||
export const addCategory = async (name: string) => { | |||
return await axios.post(SERVER_URL + '/category/add/', | |||
{ name: name }, | |||
{ | |||
headers: API_TOKEN, | |||
} | |||
) | |||
} | |||
//Need to be changed | |||
export const getCategory = async (id: string) => { | |||
return await axios.get(SERVER_URL + '/category/details/', { | |||
params: { _id: id }, | |||
headers: API_TOKEN | |||
}) | |||
} | |||
export const updateCategory = async (id: string, name: string) => { | |||
return await axios.put(SERVER_URL + '/category/update/', | |||
{ | |||
_id: id, | |||
name: name | |||
}, | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} |
@@ -0,0 +1,22 @@ | |||
import axios from "axios"; | |||
import { API_TOKEN, SERVER_URL } from "../App"; | |||
export const updateRecollectionQuestion = async (shelfId: string, wordId: string, wasRecallSuccessful: boolean) => { | |||
return await axios.post(SERVER_URL + '/recollection/update/', | |||
{ | |||
shelfId: shelfId, | |||
wordId: wordId, | |||
wasRecallSuccessful: wasRecallSuccessful | |||
}, | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} | |||
export const recollectionQuestions = async () => { | |||
return await axios.get(SERVER_URL + '/recollection/questions/', | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} |
@@ -0,0 +1,40 @@ | |||
import axios from "axios"; | |||
import { API_TOKEN, SERVER_URL } from "../App"; | |||
export const getAllShelf = async (categoryId: string) => { | |||
return await axios.get(SERVER_URL + '/shelf/details/?_id=' + { categoryId: categoryId }, | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} | |||
export const addShelf = async (categoryId: string, name: string) => { | |||
return await axios.post(SERVER_URL + '/shelf/add/', | |||
{ | |||
categoryId: categoryId, | |||
name: name | |||
}, | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} | |||
//Need to be discussed | |||
export const updateShelf = async (id: string, word: string, isArchived: boolean, spaceBetweenRecall: number) => { | |||
return await axios.put(SERVER_URL + '/shelf/update/', | |||
{ | |||
id: id, | |||
words: [{ | |||
word: word, | |||
notes: [], | |||
isArchived: isArchived, | |||
spaceBetweenRecall: spaceBetweenRecall | |||
}] | |||
}, | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} | |||
@@ -0,0 +1,9 @@ | |||
import axios from "axios"; | |||
import { SERVER_URL, API_TOKEN } from "../App"; | |||
export const getUserProfile = async() =>{ | |||
return await axios.get(SERVER_URL + '/user/profile/', | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} |
@@ -0,0 +1,33 @@ | |||
import axios from "axios"; | |||
import { SERVER_URL, API_TOKEN } from "../App"; | |||
export const getWordResult = async (name: string) => { | |||
return await axios.get(SERVER_URL + '/library/search/', { | |||
params: { name: name }, | |||
headers: API_TOKEN | |||
}) | |||
} | |||
export const getAllWords = async () => { | |||
return await axios.get(SERVER_URL + '/library/all/', | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} | |||
export const addFavouriteWord = async (wordId: string) => { | |||
return await axios.post(SERVER_URL + '/user/favourite-words/', | |||
{ wordId: wordId }, | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} | |||
export const updateFavouriteWord = async (favouriteWords: Array<string>) => { | |||
return await axios.put(SERVER_URL + '/user/favourite-words/', | |||
{ favouriteWords: favouriteWords }, | |||
{ | |||
headers: API_TOKEN | |||
}) | |||
} |