Commit bee464be authored by Marcus Filipe Carvalho Patricio Quirino's avatar Marcus Filipe Carvalho Patricio Quirino
Browse files

Merge branch 'US01/login' into 'main'

Us01/login

See merge request !28
parents 646c0c92 5d16bfb1
Showing with 5947 additions and 312 deletions
+5947 -312
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
.package-lock.json
/node_modules
/.pnp
.pnp.js
......
This diff is collapsed.
This diff is collapsed.
<svg width="444" height="148" viewBox="0 0 444 148" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M174.472 148H144.749V0H174.472V148Z" fill="#4ADDF8"/>
<path d="M201.979 29.6537L234.037 88.8784C238.111 88.8784 253.3 88.1218 256.89 86.6085C260.48 85.0264 263.622 82.894 266.314 80.2114C269.007 77.5287 271.113 74.399 272.632 70.8221C274.22 67.1764 275.014 63.3244 275.014 59.266C275.014 55.2077 274.22 51.39 272.632 47.8132C271.113 44.1675 269.007 41.0033 266.314 38.3207C263.622 35.638 260.48 33.5401 256.89 32.0268C253.3 30.4447 249.468 29.6537 245.395 29.6537H201.979ZM201.979 0L245.395 0.0412716C250.849 0.0412716 256.096 0.763525 261.136 2.20803C266.176 3.58375 270.871 5.57855 275.221 8.19242C279.639 10.7375 283.644 13.8329 287.234 17.4785C290.893 21.0554 294 25.045 296.555 29.4473C299.178 33.8496 301.18 38.5614 302.561 43.5828C304.011 48.6042 304.736 53.8319 304.736 59.266C304.736 64.3562 304.08 69.3088 302.768 74.1238C301.526 78.9388 299.696 83.5131 297.28 87.8466C294.932 92.1801 292.032 96.1697 288.58 99.8154C285.128 103.461 281.262 106.625 276.981 109.308L293.448 148H261.861L234.037 88.8784L201.979 29.6537V0Z" fill="#4ADDF8"/>
<path d="M0 44.367C0 38.245 1.17371 32.5014 3.52112 27.1361C5.86854 21.7708 9.04446 17.0933 13.0489 13.1037C17.1223 9.04536 21.8517 5.84681 27.2369 3.50809C32.6222 1.16936 38.3872 0 44.5319 0H112.676V29.6124H44.5319C42.4606 29.6124 40.5275 29.9907 38.7324 30.7474C36.9373 31.504 35.3493 32.5702 33.9685 33.9459C32.6567 35.2528 31.6211 36.8005 30.8616 38.589C30.1022 40.3774 29.7224 42.3034 29.7224 44.367C29.7224 46.4306 30.1022 48.391 30.8616 50.2482C31.6211 52.0366 32.6567 53.6187 33.9685 54.9944C35.3493 56.3014 36.9373 57.3331 38.7324 58.0898C40.5275 58.8464 42.4606 59.2248 44.5319 59.2248H74.2543C80.399 59.2248 86.164 60.3941 91.5492 62.7328C97.0035 65.0028 101.733 68.1669 105.737 72.2253C109.811 76.2149 112.987 80.9268 115.265 86.3608C117.612 91.7262 118.786 97.4698 118.786 103.592C118.786 109.714 117.612 115.457 115.265 120.823C112.987 126.188 109.811 130.9 105.737 134.958C101.733 138.948 97.0035 142.112 91.5492 144.451C86.164 146.789 80.399 147.959 74.2543 147.959H8.285V118.346H74.2543C76.3256 118.346 78.2587 117.968 80.0538 117.211C81.8489 116.455 83.4023 115.423 84.7141 114.116C86.0949 112.74 87.1651 111.158 87.9246 109.37C88.684 107.581 89.0637 105.655 89.0637 103.592C89.0637 101.528 88.684 99.6022 87.9246 97.8137C87.1651 96.0253 86.0949 94.4776 84.7141 93.1707C83.4023 91.7949 81.8489 90.7288 80.0538 89.9721C78.2587 89.2155 76.3256 88.8371 74.2543 88.8371H44.5319C38.3872 88.8371 32.6222 87.6678 27.2369 85.3291C21.8517 82.9903 17.1223 79.8262 13.0489 75.8366C9.04446 71.7782 5.86854 67.0664 3.52112 61.7011C1.17371 56.267 0 50.4889 0 44.367Z" fill="#4ADDF8"/>
<path d="M444 29.6537H342.198V0.0412716H444V29.6537Z" fill="#4ADDF8"/>
<path d="M398.757 88.6721H342.198V59.0597H398.757V88.6721Z" fill="#4ADDF8"/>
<path d="M444 145.627H342.198V116.014H444V145.627Z" fill="#4ADDF8"/>
</svg>
'use server'
import { redirect } from 'next/navigation'
import { cookies } from 'next/headers'
export async function login(formData) {
const email = formData.get('email')?.toString()
const password = formData.get('password')?.toString()
// try {
// const res = await fetch('http://localhost:8000/authentication/login', {
// headers: {
// 'Content-Type': 'application/json',
// },
// method: 'POST',
// body: JSON.stringify({ email, password }),
// })
// if (res.status !== 200) {
// const data = await res.json()
// console.log(`something went wrong: ${data.message}`)
// } else {
// const data = await res.json()
// cookies().set('token', `${data.message}`)
// redirect('/chats')
// }
// } catch (error) {
// console.log(`ERROR - something wrong with the request: ${error}`)
// }
const res = await fetch('http://localhost:8000/authentication/login', {
headers: {
'Content-Type': 'application/json',
},
method: 'POST',
body: JSON.stringify({ email, password }),
})
if (!res.ok) {
// This will activate the closest `error.js` Error Boundary
return
}
const sla = await res.json()
cookies().set('token', `${sla.message}`)
console.log(sla.message)
redirect('/chats')
return
}
import { ScrollArea } from '@/components/ui/scroll-area'
import { Message } from '../../../../components/Message/Message'
import { Input } from '@/components/ui/input'
import { Button } from '@/components/ui/button'
import { HeaderChat } from '../../../../components/HeaderChat';
export default function ChatPage({ params }) {
return (
<div className='flex flex-col h-screen'> {/* Certifique-se de que a ChatPage ocupe toda a altura disponível */}
{/* Adicionando o HeaderChat */}
<HeaderChat
name="Nome do Usuário"
icon="URL_do_Ícone"
email="email@exemplo.com"
/>
{/* ver a altura maxima, não condiz com a altura do aparelho */}
<ScrollArea className='flex-grow w-full rounded-md bg-tertiaryDark border-none p-4 mx-2 gap-1 '>
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
<Message />
</ScrollArea>
<div className='flex items-center space-x-2 justify-between m-2 w-full mx-2'> {/* Adicionado `justify-between` e `w-full mx-2` */}
<Input
type='message'
placeholder='Escreva sua mensagem aqui'
className='flex-grow border-none'
/>
<Button
type='submit'
className='border-none'
>
Enviar
</Button>
</div>
</div>
)
}
import { HomeSalas } from "@/components/HomeSalas/HomeSalas";
import { HeaderSalas } from "@/components/Header/HeaderSalas";
export default function ChatsPage() {
return (
<div className='h-full w-full'>
<HeaderSalas />
<HomeSalas />
</div>
);
}
\ No newline at end of file
import { LeftAside } from '@/components/LeftAside/LeftAside'
import { RightAside } from '@/components/RightAside/RightAside'
import '../../styles/global.css'
export const metadata = {
title: 'SIRE',
description: 'todo',
}
export default function RootLayout({ children }) {
return (
<div className='h-screen w-screen flex overflow-hidden'>
<LeftAside />
<div className='w-full h-full'>
<div className='h-[calc(100vh-146px)]'>{children}</div>
</div>
<RightAside />
</div>
)
}
import { DialogDemo } from "@/components/DialogDemo";
export default function Demo() {
return (
<main className='flex min-h-screen flex-col items-center justify-center p-24 bg-backgroundDark space-y-4'>
<h1 className='text-4xl'>Cores</h1>
<div className='flex flex-rol gap-4 justify-between'>
<div className='w-24 h-24 bg-primary text-primary-foreground rounded-lg'>
primary
</div>
<div className='w-24 h-24 bg-primaryDark text-primaryDark-foreground rounded-lg'>
primary dark
</div>
<div className='w-24 h-24 bg-secondary text-secondary-foreground rounded-lg'>
secondary
</div>
<div className='w-24 h-24 bg-secondaryDark text-secondaryDark-foreground rounded-lg'>
secondary dark
</div>
<div className='w-24 h-24 bg-tertiary text-tertiary-foreground rounded-lg'>
tertiary
</div>
<div className='w-24 h-24 bg-tertiaryDark text-tertiaryDark-foreground rounded-lg'>
tertiary dark
</div>
<div className='w-24 h-24 bg-destructive text-destructive-foreground rounded-lg'>
destructive
</div>
<div className='w-24 h-24 bg-muted text-muted-foreground rounded-lg'>
muted
</div>
<div className='w-24 h-24 bg-accent text-accent-foreground rounded-lg'>
accent
</div>
</div>
<DialogDemo />
</main>
);
}
......@@ -4,13 +4,13 @@ import { Inter } from 'next/font/google'
const inter = Inter({ subsets: ['latin'] })
export const metadata = {
title: 'Create Next App',
description: 'Generated by create next app',
title: 'SIRE',
description: 'todo',
}
export default function RootLayout({ children }) {
return (
<html lang="en">
<html lang='en'>
<body className={inter.className}>{children}</body>
</html>
)
......
import Image from 'next/image'
import { Card, CardContent, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'
import { Button } from '@/components/ui/button'
import { Input } from '@/components/ui/input'
import { Label } from '@/components/ui/label'
import { DialogRecupSenha } from '@/components/DialogRecupSenha/DialogRecupSenha'
import { login } from '@/action/login'
export default function LoginPage() {
return (
<main className='h-full flex min-h-screen flex-x-24 items-center justify-center p-24 space-x-10'>
{/* Image Section */}
<Image
className='full'
src='/sire_logo.svg'
width={550}
height={550}
alt='siri'
/>
{/* Card Section */}
<Card className='bg-background text-secundary border-none sm:w-[400px]'>
{/* Card Header */}
<CardHeader>
<CardTitle>Faça seu login</CardTitle>
</CardHeader>
{/* Card Content */}
<form action={login}>
<CardContent>
<div className='grid w-full items-center gap-4'>
{/* Email Input */}
<div className='flex flex-col space-y-1.5'>
<Label htmlFor='e-mail'>E-mail</Label>
<Input
id='e-mail'
name='email'
className='bg-secundary text-black'
placeholder='Digite seu e-mail'
type='email'
/>
</div>
{/* Password Input */}
<div className='flex flex-col space-y-1.5'>
<Label htmlFor='password'>Senha</Label>
<Input
id='password'
name='password'
className='bg-secundary text-black'
placeholder='Digite sua senha'
type='password'
/>
</div>
</div>
</CardContent>
{/* Card Footer */}
<CardFooter className='flex justify-between items-center'>
<div className='flex items-center space-x-2'>
<DialogRecupSenha />
</div>
<Button type='submit'>Entrar</Button>
</CardFooter>
</form>
</Card>
</main>
)
}
.home{
width: 750px;
}
\ No newline at end of file
import CountButton from "@/components/CountButton";
import Link from 'next/link'
import Image from 'next/image'
import { revalidatePath } from "next/cache";
let count = 0;
import { Button } from '@/components/ui/button'
import Link from 'next/link'
export default function Home() {
async function increment() {
"use server";
count++;
revalidatePath("/");
}
return (
<main className='flex min-h-screen flex-col items-center justify-center p-24 space-y-4 bg-backgroundDark'>
<h1 className='text-4xl'>SIRE</h1>
<main className='h-full flex flex-col gap-8 min-h-screen flex-x-24 items-center justify-center p-24 space-x-10'>
<Image
className="rounded-full"
src="/sire.jpeg"
width={50}
height={50}
alt="siri"
/>
<h1 className='text-4xl font-bold'>clicado {count} vezes</h1>
<CountButton increment={increment}/>
<Link href="/demo"> Demo </Link>
className='full'
src='/sire_logo.svg'
width={550}
height={550}
alt='siri'
/>
<Button
asChild
size='lg'
variant='outline'
>
<Link href='/login'>Login</Link>
</Button>
</main>
);
)
}
src/assets/images/edit.png

660 Bytes

<svg xmlns="http://www.w3.org/2000/svg" width="27" height="28" viewBox="0 0 27 28" fill="none">
<path d="M12.375 4.66669H4.5C3.90326 4.66669 3.33097 4.91252 2.90901 5.3501C2.48705 5.78769 2.25 6.38118 2.25 7.00002V23.3334C2.25 23.9522 2.48705 24.5457 2.90901 24.9833C3.33097 25.4209 3.90326 25.6667 4.5 25.6667H20.25C20.8467 25.6667 21.419 25.4209 21.841 24.9833C22.2629 24.5457 22.5 23.9522 22.5 23.3334V15.1667" stroke="#879BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M20.8125 2.91665C21.2601 2.45252 21.8671 2.19177 22.5 2.19177C23.1329 2.19177 23.7399 2.45252 24.1875 2.91665C24.6351 3.38078 24.8865 4.01027 24.8865 4.66665C24.8865 5.32302 24.6351 5.95252 24.1875 6.41665L13.5 17.5L9 18.6666L10.125 14L20.8125 2.91665Z" stroke="#879BFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
\ No newline at end of file
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
import {
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
} from "@/components/ui/card"
export function AccontCard() {
return (
<Card className="bg-background text-secundary border-none">
<CardHeader className="space-y-[8px]">
<div className="flex items-center space-x-[8px]"> {/* Retirada da classe justify-between */}
<Avatar>
<AvatarImage src="https://github.com/shadcn.png" />
<AvatarFallback>CN</AvatarFallback>
</Avatar>
<h3>Fulano beltrano</h3>
</div>
<CardDescription className="text-secundaryDark truncate">Email.da.pessoa@email.com</CardDescription>
</CardHeader>
</Card>
)
}
'use client';
import {
Avatar,
AvatarFallback,
AvatarImage,
} from "@/components/ui/avatar"
export default function AvatarIcon() {
return (
<Avatar>
<AvatarImage src="https://github.com/shadcn.png" alt="@shadcn" />
<AvatarFallback>CN</AvatarFallback>
</Avatar>
)
}
\ No newline at end of file
.container-chat-list{
margin-top: 4px;
display: flex;
height: 98%;
width: 18rem;
padding: 25px 15px 25px 25px;
flex-direction: column;
align-items: flex-start;
gap: 12px;
align-self: stretch;
border-radius: 6px;
background-color: var(--Background-1, #455085);
}
.container-chat-list h2{
padding-bottom: 45px;
color: var(--Secundaria, #FFF);
font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 600;
line-height: 28px;
background-color: var(--Background-1, #455085);
}
\ No newline at end of file
import UserBox from '@/components/UserBox/UserBox'
import { ScrollArea } from '@/components/ui/scroll-area'
import './ChatList.css'
const fetchUsers = async () => {
const res = await fetch('http://localhost:8000/users/')
if (res.ok) {
return res.json()
}
}
export const ChatList = async () => {
const users = await fetchUsers()
return (
<ScrollArea className='container-chat-list'>
<h2 className='w-[248px] h-[30px] pb-1'>Mensagens Diretas</h2>
<div className='user-list-container'>
<div>
{users.map((item, index) => (
<UserBox
key={index}
name={item.name}
icon={''}
/>
))}
</div>
</div>
</ScrollArea>
)
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment