Index: components/admin/Login.jsx
===================================================================
--- components/admin/Login.jsx	(revision e90323425d07a533dfc916a6cd7c156c1cc2b8f6)
+++ components/admin/Login.jsx	(revision e90323425d07a533dfc916a6cd7c156c1cc2b8f6)
@@ -0,0 +1,119 @@
+import React from 'react'
+
+import { useSelector, useDispatch } from 'react-redux'
+
+import { useRef } from 'react'
+
+import { setAdmin } from '../../redux/reducers/adminSlice';
+import { setStyle } from '../../redux/reducers/styleSlice';
+
+import axios from 'axios';
+
+const Login = () => {
+    const ref = useRef(null);
+
+    const dispatch = useDispatch();
+
+    const adminState = useSelector(state => state.admin);
+    const styleState = useSelector(state => state.style);
+
+    setTimeout(() => {
+        if (adminState.admin.displays.setFocus) {
+            if (ref !== null && ref.current !== null) {
+                ref.current.focus();
+            }
+
+            dispatch(setAdmin({
+                ...adminState.admin,
+                displays: {
+                    ...adminState.admin.displays,
+                    setFocus: false
+                }
+            }))
+        }
+    }, 10);
+
+    function onChangeUsername(e) {
+        dispatch(setAdmin({
+            ...adminState.admin,
+            inputControls: {
+                ...adminState.admin.inputControls,
+                username: e.target.value,
+            }
+        }))
+    }
+
+    function onChangePassword(e) {
+        dispatch(setAdmin({
+            ...adminState.admin,
+            inputControls: {
+                ...adminState.admin.inputControls,
+                password: e.target.value,
+            }
+        }))
+    }
+
+    function keyUp(e) {
+        if (e.key === 'Enter') {
+            login();
+        }
+    }
+
+    function login() {
+        dispatch(setStyle({
+            ...styleState.style,
+            displayLoadingScreen: true,
+        }))
+
+        axios.post(`/api/postgre`, {
+            action: 'login_as_admin',
+            username: adminState.admin.inputControls.username,
+            password: adminState.admin.inputControls.password,
+        })
+            .then(res => {
+                if (res.data?.success) {
+                    localStorage.CAESSINO_ADMIN_ID = res.data?.session?.id;
+
+                    dispatch(setAdmin({
+                        ...adminState.admin,
+                        session_id: res.data?.session?.id,
+                        inlineAlertText: '',
+                        inputControls: {
+                            username: '',
+                            password: '',
+                        }
+                    }))                    
+                }
+                else {
+                    dispatch(setAdmin({
+                        ...adminState.admin,
+                        inlineAlertText: res.data?.message,
+                    }));
+                }
+                
+                dispatch(setStyle({
+                    ...styleState.style,
+                    displayLoadingScreen: false,
+                }))
+            })
+    }
+
+    return (
+        <div className="fullscreen fs-centered admin loginScreen">
+            <div className="fs-inputs-container">
+                <div>
+                    {adminState.admin.inlineAlertText.length > 0 && <span className="inlineAlert">{adminState.admin.inlineAlertText}</span>}
+                    <span>Username:</span>
+                    <input ref={ref} type="text" onChange={(e) => {onChangeUsername(e)}} onKeyUp={(e) => keyUp(e)} value={adminState.admin.inputControls.username} placeholder="admin"/>
+                    <span>Password:</span>
+                    <input type="password" onChange={(e) => {onChangePassword(e)}} onKeyUp={(e) => keyUp(e)} value={adminState.admin.inputControls.password} placeholder="****************"/>
+                    <div style={{width: '100%', display: 'flex', flexDirection: 'row', justifyContent: 'flex-end'}}>
+                        <button className="secondaryButton" onClick={() => login()}>Log In as Admin</button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default Login
