andreas/portfolio2023
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

commit working state

Browse Source
This commit is contained in:
Andreas Schaafsma
2024-04-15 11:38:40 +02:00
parent 89f3f86c54
commit 508258bf0f
33 changed files with 1130 additions and 221 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
src/app/admin/login/page.tsx Normal file
View File

@@ -0,0 +1,40 @@
'use client'
import { authenticate } from '@/app/lib/actions'
import { useFormState, useFormStatus } from "react-dom";
import { cookies } from 'next/headers';
export default function Page(state:any) {
const [loginResult, dispatch] = useFormState(authenticate, undefined)
console.log(dispatch);
console.log(state);
// if(loginResult?.cookie && loginResult.cookie){
// cookies().set('auth',loginResult.cookie['auth'])
// }
return (
<main className="h-screen w-screen flex flex-col p-10 bg-background-500 box-border m-0">
<form action={dispatch}>
<input type="text" name="username" placeholder="Username" required />
<input type="password" name="password" placeholder="Password" required />
<div>{loginResult?.errorMessage && <p>{loginResult?.errorMessage}</p>}</div>
<LoginButton />
</form>
<div>
<p>{""+loginResult?.cookie}</p>
</div>
</main>
)
}
function LoginButton() {
const { pending } = useFormStatus()
return (
<button aria-disabled={pending} className="mr-auto bg-secondary-200 outline outline-2 border-5 p-3 mt-3 rounded-lg outline-secondary-500 shadow-primary" type="submit">
Login
</button>
)
}

65
src/app/admin/page.tsx
View File

@@ -1,58 +1,13 @@
'use client'
import Container from 'react-bootstrap/Container';
import Nav from 'react-bootstrap/Nav';
import Navbar from 'react-bootstrap/Navbar';
import NavDropdown from 'react-bootstrap/NavDropdown';
import Button from 'react-bootstrap/Button';
import Form from 'react-bootstrap/Form';
import AdminPanel from "@/components/admin/adminPanel";
import AuthHandler from "@/components/admin/authHandler";
import { cookies } from "next/headers";
export default function Page(){
return <div>
<Navbar bg="light" expand="lg">
<Container>
<Navbar.Brand href="#home">React-Bootstrap</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="me-auto">
<Nav.Link href="#home">Home</Nav.Link>
<Nav.Link href="#link">Link</Nav.Link>
<NavDropdown title="Dropdown" id="basic-nav-dropdown">
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
<NavDropdown.Item href="#action/3.2">
Another action
</NavDropdown.Item>
<NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
<NavDropdown.Divider />
<NavDropdown.Item href="#action/3.4">
Separated link
</NavDropdown.Item>
</NavDropdown>
</Nav>
</Navbar.Collapse>
</Container>
</Navbar>
<Container style={{width:"800px"}}>
<Form>
<Form.Group className="mb-3" controlId="formBasicEmail">
<Form.Label>Email address</Form.Label>
<Form.Control type="email" placeholder="Enter email" />
<Form.Text className="text-muted">
We'll never share your email with anyone else.
</Form.Text>
</Form.Group>
<Form.Group className="mb-3" controlId="formBasicPassword">
<Form.Label>Password</Form.Label>
<Form.Control type="password" placeholder="Password" />
</Form.Group>
<Form.Group className="mb-3" controlId="formBasicCheckbox">
<Form.Check type="checkbox" label="Check me out" />
</Form.Group>
<Button variant="primary" type="submit">
Submit
</Button>
</Form>
</Container>
</div>
export default async function Page(){
return (
<main className="h-screen w-screen flex flex-col p-10 bg-background-500 box-border m-0">
<AuthHandler params={null}><AdminPanel><p>this is only shown on the admin panel</p></AdminPanel></AuthHandler>
<section>{JSON.stringify(cookies().getAll())}</section>
</main>
);
}