production build, for rehersal

SKKUD · Aug 10, 2022 · d1582b5 · d1582b5
1 parent 94a6595
commit d1582b5
Show file tree

Hide file tree

Showing 21 changed files with 746 additions and 2,220 deletions.
diff --git a/.gitignore b/.gitignore
@@ -25,4 +25,7 @@ yarn-debug.log*
 yarn-error.log*
 
 # env file
-.env
+.env
+
+# Custom
+skku-qr-c22c2419e905.json
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -7,7 +7,6 @@
     "@emotion/react": "^11.9.3",
     "@emotion/styled": "^11.9.3",
     "@material-ui/core": "^4.12.4",
-    "@google-cloud/text-to-speech": "^4.0.0",
     "@mui/icons-material": "^5.8.4",
     "@mui/material": "^5.9.1",
     "@testing-library/jest-dom": "^5.16.4",

diff --git a/public/index.html b/public/index.html
@@ -27,6 +27,8 @@
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
 		<title>SKKU QR</title>
+		<script src="https://apis.google.com/js/api.js"></script>
+
 		<link rel="stylesheet" href="index.css" />
 	</head>
 	<body>

diff --git a/src/1-hour-of-silence.mp3 b/src/1-hour-of-silence.mp3
diff --git a/src/App.js b/src/App.js
@@ -1,10 +1,13 @@
-import React, { useState, useEffect } from 'react';
+import { useState, useEffect, useMemo } from 'react';
 import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import { createTheme, ThemeProvider } from '@mui/material';
 import useMediaQuery from '@mui/material/useMediaQuery';
 import CssBaseline from '@mui/material/CssBaseline';
+import { verify } from '../src/api/auth';
+
+// Context
 import { SocketContext, socket } from './context/socket';
-import { verify } from "../src/api/auth";
+import { UserContext } from './context/user';
 
 // importing pages
 import Main from './pages/Main';
@@ -14,11 +17,14 @@ import Admin from './pages/Admin';
 import UserTable from './pages/UserTable';
 import QRReader from './pages/QRReader';
 import Presentation from './pages/Presentation';
+import UserFormPage from './pages/UserFormPage';
 
 function App() {
-	const [userState, setUserState] = useState(null);
+	const [userState, setUserState] = useState(false);
+	const value = useMemo(() => ({ userState, setUserState }), [userState]);
+
 	const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)');
-	const theme = React.useMemo(
+	const theme = useMemo(
 		() =>
 			createTheme({
 				palette: {
@@ -39,35 +45,33 @@ function App() {
 		[prefersDarkMode]
 	);
 
-  useEffect(() => {
-    verify()
-      .then(
-        ({
-          data: {
-            data: { role },
-          },
-        }) => setUserState(role)
-      )
-      .catch(() => setUserState(null));
-  }, []);
+	useEffect(() => {
+		verify()
+			.then(({ data: { data } }) => {
+				setUserState(data.role);
+			})
+			.catch(() => setUserState(false));
+	}, []);
 
 	return (
 		<ThemeProvider theme={theme}>
 			<CssBaseline />
 			<SocketContext.Provider value={socket}>
-				<BrowserRouter>
-					<Routes>
-						<Route path="/" element={<Main />} />
-						<Route path="login" element={<Login />} />
-						<Route path="user" element={<User />}>
-							<Route path=":userId" element={<User />} />
-						</Route>
-						<Route path="admin" element={<Admin />} />
-						<Route path="admin/usertable" element={<UserTable />} />
-						<Route path="admin/qrreader" element={<QRReader />} />
-						<Route path="admin/presentation" element={<Presentation />} />
-					</Routes>
-				</BrowserRouter>
+				<UserContext.Provider value={value}>
+					<BrowserRouter>
+						<Routes>
+							<Route path="/" element={<Main />} />
+							<Route path="login" element={<Login />} />
+							<Route path="/user/:userId" element={<User />} />
+
+							<Route path="admin" element={<Admin />} />
+							<Route path="admin/usertable" element={<UserTable />} />
+							<Route path="admin/userform/:id" element={<UserFormPage />} />
+							<Route path="admin/qrreader" element={<QRReader />} />
+							<Route path="admin/presentation" element={<Presentation />} />
+						</Routes>
+					</BrowserRouter>
+				</UserContext.Provider>
 			</SocketContext.Provider>
 		</ThemeProvider>
 	);

diff --git a/src/api/auth.js b/src/api/auth.js
@@ -6,15 +6,13 @@ axios.defaults.withCredentials = true;
 export const login = async (studentId, password) => {
 	try {
 		const result = await axios.post(
-
 			`${process.env.REACT_APP_API_URL}/auth/login`,
-     
+
 			{
-  				studentId: studentId,
-  				password: password,
-  			}
-
-    );
+				studentId: studentId,
+				password: password,
+			}
+		);
 
 		return result;
 	} catch (error) {
@@ -25,9 +23,7 @@ export const login = async (studentId, password) => {
 export const logout = async () => {
 	try {
 		const result = await axios.post(
-
 			`${process.env.REACT_APP_API_URL}/auth/logout`
-
 		);
 		return result;
 	} catch (error) {
@@ -38,9 +34,7 @@ export const logout = async () => {
 export const verify = async () => {
 	try {
 		const result = await axios.get(
-
 			`${process.env.REACT_APP_API_URL}/auth/verify`
-
 		);
 		return result;
 	} catch (error) {
@@ -58,14 +52,15 @@ export const getAllUsers = async () => {
 };
 
 export const getOneUser = async (studentId) => {
-  try {
-    const result = await axios.get(
-      `${process.env.REACT_APP_API_URL}/auth/${studentId}`
-    );
-    return result.data.data.user;
-  } catch (error) {
-    throw new Error(error.message);
-  }
+	try {
+		const result = await axios.get(
+			`${process.env.REACT_APP_API_URL}/auth/${studentId}`
+		);
+		console.log(result)
+		return result.data.data.user;
+	} catch (error) {
+		throw new Error(error.message);
+	}
 };
 
 export const addUser = async (
@@ -89,11 +84,9 @@ export const addUser = async (
 		if (!userValidation(body))
 			throw Error('유효성 검사에서 통과하지 못했습니다.');
 		const result = axios.post(
-
 			`${process.env.REACT_APP_API_URL}/auth/register`,
-     
+
 			body
-
 		);
 		return result;
 	} catch (error) {
@@ -116,11 +109,9 @@ export const updateUser = async (id, properties) => {
 	try {
 		const body = properties;
 		const result = axios.patch(
-
 			`${process.env.REACT_APP_API_URL}/auth/${id}`,
-     
+
 			body
-
 		);
 		return result;
 	} catch (error) {
@@ -131,9 +122,7 @@ export const updateUser = async (id, properties) => {
 export const resetCheckInAll = async () => {
 	try {
 		const result = await axios.patch(
-
 			`${process.env.REACT_APP_API_URL}/auth/checkin`
-
 		);
 		return result;
 	} catch (error) {
@@ -144,9 +133,7 @@ export const resetCheckInAll = async () => {
 export const resetCheckInOne = async (id) => {
 	try {
 		const result = await axios.patch(
-
 			`${process.env.REACT_APP_API_URL}/auth/checkin/${id}`
-
 		);
 		return result;
 	} catch (error) {

diff --git a/src/api/voiceTTS.js b/src/api/voiceTTS.js
@@ -0,0 +1,33 @@
+import axios from 'axios';
+
+export default async function voiceTTS(text) {
+    axios.defaults.headers['Access-Control-Allow-Origin'] = '*';
+	const response = await axios.post(
+		`https://texttospeech.googleapis.com/v1/text:synthesize?key=${process.env.REACT_APP_GOOGLE_APPLICATION_CREDENTIALS}`,
+		{
+			input: {
+				text: text,
+			},
+			voice: {
+				languageCode: 'ko-KR',
+				ssmlGender: 'FEMALE',
+			},
+			audioConfig: {
+				audioEncoding: 'LINEAR16',
+				speakingRate: 1,
+			},
+        }, {
+            headers: {
+
+            }
+        }
+	);
+
+	console.log(response);
+	// Write the binary audio content to a local file
+	const newAudio = new Audio(
+		'data:audio/wav;base64,' + response.data?.audioContent
+	);
+
+	newAudio.play();
+}
diff --git a/src/components/admin/AdminTable.js b/src/components/admin/AdminTable.js
@@ -18,7 +18,7 @@ const FlexBox = styled.div`
   justify-content: flex-end;
 `;
 
-export default function UserTable({ userState }) {
+export default function UserTable() {
   const [users, setUsers] = useState([]);
   const navigate = useNavigate();