Mathis
1dd0384857
This commit introduces user data management with the addition of new interfaces and services. User data interface which defines the structure of user data was created. Account handler service for registering, logging in, updating user data and disconnecting was also added. User data provider component was created for managing user data state. The account info component for displaying and editing the user account was introduced too. Finally, updates were made in the existing components and services for accommodating these new elements.
26 lines
939 B
TypeScript
26 lines
939 B
TypeScript
import Image from "next/image";
|
|
import React from "react";
|
|
import {ThemeBtnSelector} from "@/components/theme-btn-selector";
|
|
import {AccountDialog} from "@/components/account-dialog";
|
|
|
|
|
|
export function Header({title, children}: {title?: string, children?: React.ReactNode}) {
|
|
|
|
|
|
|
|
return (
|
|
<header className={"flex flex-col md:flex-row justify-between items-center w-full p-1 md:px-3 md:py-2 border-b-2"}>
|
|
<div className={"flex flex-row justify-center md:justify-start items-center gap-2 md:w-1/3"}>
|
|
<Image src={'yellow-bit.svg'} alt={'Logo of YeloBit'} width={42} height={42}/>
|
|
<h1 className={"font-bold text-xl align-middle text-center text-wrap"}>{title || 'YeloBit'}</h1>
|
|
</div>
|
|
<div className={"w-1/3 flex flex-row justify-center items-center"}>
|
|
{children}
|
|
</div>
|
|
<div className={"w-1/3 flex flex-row justify-end gap-2 items-center"}>
|
|
<AccountDialog/>
|
|
<ThemeBtnSelector/>
|
|
</div>
|
|
</header>
|
|
)
|
|
} |