Skip to content

Commit

Permalink
run prettier
Browse files Browse the repository at this point in the history
  • Loading branch information
andychenbruce committed Mar 11, 2024
1 parent 632b558 commit 32adc31
Show file tree
Hide file tree
Showing 19 changed files with 633 additions and 532 deletions.
4 changes: 2 additions & 2 deletions frontend/eslint.config.mjs
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
// @ts-check

import eslint from '@eslint/js';
import tseslint from 'typescript-eslint';
import eslint from "@eslint/js";
import tseslint from "typescript-eslint";

export default tseslint.config(
eslint.configs.recommended,
Expand Down
26 changes: 13 additions & 13 deletions frontend/src/backend_interface.ts
Original file line number Diff line number Diff line change
Expand Up @@ -89,9 +89,9 @@ export interface DeleteCardDeck {

// response <- ENDPOINT_ADD_RATING
export interface AddRating {
access_token: AccessToken,
deck_id: number,
new_rating: number,
access_token: AccessToken;
deck_id: number;
new_rating: number;
}

// request -> ENDPOINT_SET_DECK_ICON
Expand Down Expand Up @@ -196,24 +196,24 @@ export interface ListFavoritesResponse {

// request -> ENDPOINT_ADD_FAVORITE
export interface AddFavorite {
access_token: AccessToken,
user_id: number,
deck_id: number,
access_token: AccessToken;
user_id: number;
deck_id: number;
}

// request -> ENDPOINT_DELETE_FAVORITE
export interface DeleteFavorite {
access_token: AccessToken,
user_id: number,
deck_id: number,
access_token: AccessToken;
user_id: number;
deck_id: number;
}

// request -> ENDPOINT_GET_RANDOM_DECKS
export interface RandomDecksRequest{
num_decks: number
export interface RandomDecksRequest {
num_decks: number;
}

// response -> ENDPOINT_GET_RANDOM_DECKS
export interface RandomDecksResponse{
decks: CardDeck[]
export interface RandomDecksResponse {
decks: CardDeck[];
}
79 changes: 45 additions & 34 deletions frontend/src/navbar.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,18 @@

import React, { useState } from "react";
import {Button, InputBase, Menu, Snackbar, MenuItem,Dialog, TextField, DialogContent, DialogTitle, DialogActions, ListItemText, DialogContentText,} from "@mui/material";
import {
Button,
InputBase,
Menu,
Snackbar,
MenuItem,
Dialog,
TextField,
DialogContent,
DialogTitle,
DialogActions,
ListItemText,
DialogContentText,
} from "@mui/material";
import { redirect, send_json_backend } from "./utils";
import { ENDPOINT_DELETE_USER, DeleteUser } from "./backend_interface";
import { ENDPOINT_CHANGE_PASSWORD, ChangePassword } from "./backend_interface";
Expand All @@ -9,20 +21,22 @@ import HomeIcon from "@mui/icons-material/Home";
import BackupTableOutlinedIcon from "@mui/icons-material/BackupTableOutlined";
import Person2OutlinedIcon from "@mui/icons-material/Person2Outlined";
import SearchOutlinedIcon from "@mui/icons-material/SearchOutlined";
import ChatIcon from '@mui/icons-material/Chat';
import ChatIcon from "@mui/icons-material/Chat";
// import logo from './../../assets/logo.png';

export const Navbar = () => {
const [searchQuery, setSearchQuery] = useState(""); //state of whats in search bar
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null); //dropdown bar to anchor at 'account' button
const [openDeleteDialog, setOpenDeleteDialog] = useState(false); //popup for account deletion
const [openPassChangeDialog, setOpenPassChangeDialog] = useState(false);//popup for password change
const [openDeleteDialog, setOpenDeleteDialog] = useState(false); //popup for account deletion
const [openPassChangeDialog, setOpenPassChangeDialog] = useState(false); //popup for password change
const [ChangePassError, setChangePassError] = useState(false);
const [errorFields, setErrorFields] = useState<string[]>([]);
const [errorFields2, setErrorFields2] = useState<string[]>([]);
const [showPassChangeSuccessSnackbar, setshowPassChangeSuccessSnackbar] = useState(false);
const [showPassChangeSuccessSnackbar, setshowPassChangeSuccessSnackbar] =
useState(false);
const [showDeleteErrorSnackbar, setShowDeleteErrorSnackbar] = useState(false);
const [showDeleteSuccessSnackbar, setshowDeleteSuccessSnackbar] = useState(false);
const [showDeleteSuccessSnackbar, setshowDeleteSuccessSnackbar] =
useState(false);
const [user, setUser] = useState({
email: "",
password: "",
Expand Down Expand Up @@ -65,24 +79,20 @@ export const Navbar = () => {
email: user.email,
password: user.password,
};
send_json_backend(
ENDPOINT_DELETE_USER,
JSON.stringify(deleteUserRequest),
)
.then(() => {
console.log("User deleted successfully.");
console.log("Logging out...");
setshowDeleteSuccessSnackbar(true);
logout();
window.location.pathname = "/login/";
})
.catch((error) => {
console.error("Error deleting user:", error);
setErrorFields2(["email", "password"]);
setTimeout(() => setErrorFields2([]), 2000);
setShowDeleteErrorSnackbar(true);
});

send_json_backend(ENDPOINT_DELETE_USER, JSON.stringify(deleteUserRequest))
.then(() => {
console.log("User deleted successfully.");
console.log("Logging out...");
setshowDeleteSuccessSnackbar(true);
logout();
window.location.pathname = "/login/";
})
.catch((error) => {
console.error("Error deleting user:", error);
setErrorFields2(["email", "password"]);
setTimeout(() => setErrorFields2([]), 2000);
setShowDeleteErrorSnackbar(true);
});
};

// stuff for pass change
Expand Down Expand Up @@ -156,7 +166,7 @@ export const Navbar = () => {
redirect("/home_page");
}}
>
<HomeIcon />
<HomeIcon />
Home
</Button>
<div
Expand Down Expand Up @@ -236,7 +246,6 @@ export const Navbar = () => {
Account
</Button>
<Menu

anchorEl={anchorEl}
open={Boolean(anchorEl)}
onClose={handleMenuClose}
Expand Down Expand Up @@ -293,7 +302,7 @@ export const Navbar = () => {
</MenuItem>
</Menu>

{/* DELETE ACCOUNT SECTION */}
{/* DELETE ACCOUNT SECTION */}

<Dialog
open={openDeleteDialog}
Expand All @@ -302,12 +311,12 @@ export const Navbar = () => {
aria-describedby="alert-dialog-description"
>
<DialogTitle
style={{ background: "#140952a6" , color: "white" }}
style={{ background: "#140952a6", color: "white" }}
id="alert-dialog-title"
>
Confirm Delete Account
</DialogTitle>
<DialogContent style={{ background: "#140952a6" }}>
<DialogContent style={{ background: "#140952a6" }}>
<DialogContentText
style={{ color: "white" }}
id="alert-dialog-description"
Expand Down Expand Up @@ -335,7 +344,9 @@ export const Navbar = () => {
<TextField
style={{
marginBottom: 20,
borderColor: errorFields2.includes("password") ? "red" : undefined,
borderColor: errorFields2.includes("password")
? "red"
: undefined,
}}
error={errorFields2.includes("password")}
label="Password"
Expand Down Expand Up @@ -384,19 +395,19 @@ export const Navbar = () => {
>
<DialogTitle
id="alert-dialog-title"
style={{ background: "#140952a6" , color: "white" }}
style={{ background: "#140952a6", color: "white" }}
>
Change Password
</DialogTitle>
<DialogContent style={{ background: "#140952a6" }}>
<DialogContent style={{ background: "#140952a6" }}>
<DialogContentText
id="alert-dialog-description"
style={{ color: "white" }}
>
Please enter your Email, Old Password and New Password
</DialogContentText>
</DialogContent>
<DialogActions style={{ background: "#140952a6" }}>
<DialogActions style={{ background: "#140952a6" }}>
<TextField
style={{
marginBottom: 20,
Expand Down
70 changes: 36 additions & 34 deletions frontend/src/pages/ai_test/ai_test.css
Original file line number Diff line number Diff line change
@@ -1,34 +1,36 @@
.div1 {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
width: 100%;
margin: 0;
padding: 0;
height: 100vh;
}

.paper, .paper2, .paper3 {
padding: 40px;
margin: 20px auto;
background-color: rgba(128, 128, 128, 0.4);
border: 2px solid black;
width: 90%;
}

.paper {
background-color: rgba(128, 128, 128, 0.4);
width: 70%;
}

.paper2 {
background-color: rgba(128, 128, 128, 0.3);
border-radius: 20px;
height: auto;
}

.paper3 {
background-color: rgba(128, 128, 128, 0.5);
height: auto;
}
.div1 {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
width: 100%;
margin: 0;
padding: 0;
height: 100vh;
}

.paper,
.paper2,
.paper3 {
padding: 40px;
margin: 20px auto;
background-color: rgba(128, 128, 128, 0.4);
border: 2px solid black;
width: 90%;
}

.paper {
background-color: rgba(128, 128, 128, 0.4);
width: 70%;
}

.paper2 {
background-color: rgba(128, 128, 128, 0.3);
border-radius: 20px;
height: auto;
}

.paper3 {
background-color: rgba(128, 128, 128, 0.5);
height: auto;
}
62 changes: 46 additions & 16 deletions frontend/src/pages/ai_test/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Navbar } from "../../navbar";
import { Button, TextField, Typography, Paper } from "@mui/material";
import { ENDPOINT_AI_TEST, AiPromptTest } from "../../backend_interface";
import { send_json_backend } from "../../utils";
import './ai_test.css';
import "./ai_test.css";
const App: React.FC = () => {
const [prompt, setPrompt] = useState("");
const [response, setResponse] = useState("");
Expand All @@ -12,7 +12,7 @@ const App: React.FC = () => {
const aiSend: AiPromptTest = {
prompt: prompt,
};
console.log('prompt:', prompt)
console.log("prompt:", prompt);
send_json_backend(ENDPOINT_AI_TEST, JSON.stringify(aiSend))
.then((data: any) => {
setResponse(data);
Expand All @@ -25,37 +25,67 @@ const App: React.FC = () => {
return (
<div>
<Navbar />
<div className='div1'>
<Paper className = 'paper' sx={{borderRadius: '10px', backgroundColor: 'rgba(128, 128, 128, 0.5)'}}>
<Typography variant="h4" align="center">AI Chat</Typography>
<div className="div1">
<Paper
className="paper"
sx={{
borderRadius: "10px",
backgroundColor: "rgba(128, 128, 128, 0.5)",
}}
>
<Typography variant="h4" align="center">
AI Chat
</Typography>
<TextField
value={prompt}
onChange={(e) => setPrompt(e.target.value)}
fullWidth
margin="normal"
style={{borderRadius: '10px' }}
style={{ borderRadius: "10px" }}
required
label="Ask a Question!"
InputLabelProps={{ style: { color: "black" } }}
/>
<Button variant="contained" onClick={submitPrompt} sx={{backgroundColor: "#9c27b0",
"&:hover": {
backgroundColor: "#7b1fa2",
},}} fullWidth>
<Button
variant="contained"
onClick={submitPrompt}
sx={{
backgroundColor: "#9c27b0",
"&:hover": {
backgroundColor: "#7b1fa2",
},
}}
fullWidth
>
Submit Prompt
</Button>
<p style={{color: 'white'}}> *Please Note that responses may take a minute to process and generate </p>
<p style={{ color: "white" }}>
{" "}
*Please Note that responses may take a minute to process and
generate{" "}
</p>
</Paper>
<Paper className='paper2' sx={{borderRadius: '50px', backgroundColor: 'rgba(128, 128, 128, 0.5)'}}>
<Paper
className="paper2"
sx={{
borderRadius: "50px",
backgroundColor: "rgba(128, 128, 128, 0.5)",
}}
>
<header>Response:</header>
<Paper className="paper3" sx={{borderRadius: '20px', backgroundColor: 'rgba(128, 128, 128, 0.5)'}}>
{response}
</Paper>
<Paper
className="paper3"
sx={{
borderRadius: "20px",
backgroundColor: "rgba(128, 128, 128, 0.5)",
}}
>
{response}
</Paper>
</Paper>
</div>
</div>
);
};

export default App;

Loading

0 comments on commit 32adc31

Please sign in to comment.