mirror of
https://github.com/documenso/documenso.git
synced 2025-11-12 15:53:02 +10:00
Avatar from user
This commit is contained in:
@ -1,4 +1,4 @@
|
||||
import { Fragment } from "react";
|
||||
import { Fragment, useEffect } from "react";
|
||||
import { Disclosure, Menu, Transition } from "@headlessui/react";
|
||||
import Link from "next/link";
|
||||
import { useRouter } from "next/router";
|
||||
@ -18,12 +18,13 @@ import {
|
||||
} from "@heroicons/react/24/outline";
|
||||
import Logo from "./logo";
|
||||
|
||||
const user = {
|
||||
name: "Timur Ercan",
|
||||
email: "timur@documenso.com",
|
||||
imageUrl:
|
||||
"https://pbs.twimg.com/profile_images/1382036502390181888/4BT30oTM_400x400.jpg",
|
||||
let user: {
|
||||
id?: number | undefined;
|
||||
name?: string | null;
|
||||
email?: string | null;
|
||||
image?: string | null;
|
||||
};
|
||||
|
||||
const navigation = [
|
||||
{
|
||||
name: "Dashboard",
|
||||
@ -77,7 +78,11 @@ function classNames(...classes: any) {
|
||||
}
|
||||
|
||||
export default function TopNavigation() {
|
||||
// const session = useSession();
|
||||
const session = useSession();
|
||||
|
||||
useEffect(() => {
|
||||
user = { ...session.data?.user };
|
||||
});
|
||||
|
||||
const router = useRouter();
|
||||
navigation.forEach((element) => {
|
||||
@ -119,16 +124,20 @@ export default function TopNavigation() {
|
||||
</div>
|
||||
<div className="hidden sm:ml-6 sm:flex sm:items-center">
|
||||
<span className="text-sm">
|
||||
<p className="font-bold">{user.name}</p>
|
||||
<p>{user.email}</p>
|
||||
<p className="font-bold">{user?.name || ""}</p>
|
||||
<p>{user?.email}</p>
|
||||
</span>
|
||||
<Menu as="div" className="relative ml-3">
|
||||
<div>
|
||||
<Menu.Button className="flex max-w-xs items-center rounded-full bg-white text-sm focus:outline-none focus:ring-2 focus:ring-neon focus:ring-offset-2">
|
||||
<span className="sr-only">Open user menu</span>
|
||||
<div
|
||||
key={user?.email}
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: avatarFromInitials("Timur Ercan", 40),
|
||||
__html: avatarFromInitials(
|
||||
user?.name || "" || "",
|
||||
40
|
||||
),
|
||||
}}
|
||||
/>
|
||||
</Menu.Button>
|
||||
@ -184,52 +193,50 @@ export default function TopNavigation() {
|
||||
<Disclosure.Panel className="sm:hidden">
|
||||
<div className="space-y-1 pt-2 pb-3">
|
||||
{navigation.map((item) => (
|
||||
<Disclosure.Button
|
||||
<Link
|
||||
key={item.name}
|
||||
as="a"
|
||||
href={item.href}
|
||||
as="a"
|
||||
className={classNames(
|
||||
item.current
|
||||
? "bg-indigo-50 border-indigo-500 text-indigo-700"
|
||||
? "bg-teal-50 border-teal-500 text-teal-700"
|
||||
: "border-transparent text-gray-600 hover:bg-gray-50 hover:border-gray-300 hover:text-gray-800",
|
||||
"block pl-3 pr-4 py-2 border-l-4 text-base font-medium"
|
||||
)}
|
||||
aria-current={item.current ? "page" : undefined}
|
||||
>
|
||||
{item.name}
|
||||
</Disclosure.Button>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
<div className="border-t border-gray-200 pt-4 pb-3">
|
||||
<div className="flex items-center px-4">
|
||||
<div className="flex-shrink-0">
|
||||
<img
|
||||
className="h-10 w-10 rounded-full"
|
||||
src={user.imageUrl}
|
||||
alt=""
|
||||
<div
|
||||
key={user?.email}
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: avatarFromInitials(user?.name || "" || "", 40),
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="ml-3">
|
||||
<div className="text-base font-medium text-gray-800">
|
||||
{user.name}
|
||||
{user?.name || ""}
|
||||
</div>
|
||||
<div className="text-sm font-medium text-gray-500">
|
||||
{user.email}
|
||||
{user?.email}
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
className="ml-auto flex-shrink-0 rounded-full bg-white p-1 text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-neon focus:ring-offset-2"
|
||||
>
|
||||
<span className="sr-only">View notifications</span>
|
||||
<BellIcon className="h-6 w-6" aria-hidden="true" />
|
||||
</button>
|
||||
></button>
|
||||
</div>
|
||||
<div className="mt-3 space-y-1">
|
||||
{userNavigation.map((item) => (
|
||||
<Link
|
||||
key={item.name}
|
||||
as="a"
|
||||
onClick={item.click}
|
||||
href={item.href}
|
||||
className="block px-4 py-2 text-base font-medium text-gray-500 hover:bg-gray-100 hover:text-gray-800"
|
||||
>
|
||||
|
||||
@ -16,14 +16,9 @@ import { useRouter } from "next/router";
|
||||
import Link from "next/link";
|
||||
import Head from "next/head";
|
||||
import avatarFromInitials from "avatar-from-initials";
|
||||
|
||||
const user = {
|
||||
name: "Debbie Lewis",
|
||||
handle: "deblewis",
|
||||
email: "debbielewis@example.com",
|
||||
imageUrl:
|
||||
"https://images.unsplash.com/photo-1517365830460-955ce3ccd263?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=4&w=320&h=320&q=80",
|
||||
};
|
||||
import { useSession } from "next-auth/react";
|
||||
import { User } from "next-auth";
|
||||
import { Value } from "sass";
|
||||
|
||||
const subNavigation = [
|
||||
{
|
||||
@ -52,6 +47,8 @@ function classNames(...classes: any) {
|
||||
|
||||
export default function Setttings() {
|
||||
const [availableToHire, setAvailableToHire] = useState(true);
|
||||
const session = useSession();
|
||||
let user = session.data?.user;
|
||||
|
||||
const router = useRouter();
|
||||
subNavigation.forEach((element) => {
|
||||
@ -81,7 +78,7 @@ export default function Setttings() {
|
||||
href={item.href}
|
||||
className={classNames(
|
||||
item.current
|
||||
? "bg-teal-50 border-teal-500 text-teal-700 hover:bg-teal-50 hover:text-teal-700"
|
||||
? "bg-teal-50 border-neon-dark text-teal-700 hover:bg-teal-50 hover:text-teal-700"
|
||||
: "border-transparent text-gray-900 hover:bg-gray-50 hover:text-gray-900",
|
||||
"group border-l-4 px-3 py-2 flex items-center text-sm font-medium"
|
||||
)}
|
||||
@ -194,7 +191,8 @@ export default function Setttings() {
|
||||
type="text"
|
||||
name="first-name"
|
||||
id="first-name"
|
||||
value="Timur Ercan"
|
||||
value={user?.name || ""}
|
||||
onChange={() => {}}
|
||||
autoComplete="given-name"
|
||||
className="mt-1 block w-full rounded-md border border-gray-300 py-2 px-3 shadow-sm focus:border-neon focus:outline-none focus:ring-neon sm:text-sm"
|
||||
/>
|
||||
@ -208,7 +206,7 @@ export default function Setttings() {
|
||||
</label>
|
||||
<input
|
||||
disabled
|
||||
value={user.email}
|
||||
value={user?.email}
|
||||
type="text"
|
||||
name="first-name"
|
||||
id="first-name"
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import NextAuth from "next-auth";
|
||||
import NextAuth, { Session } from "next-auth";
|
||||
import GitHubProvider from "next-auth/providers/github";
|
||||
import CredentialsProvider from "next-auth/providers/credentials";
|
||||
import { ErrorCode } from "@documenso/lib/auth";
|
||||
@ -67,11 +67,29 @@ export default NextAuth({
|
||||
}
|
||||
|
||||
return {
|
||||
id: user.id.toString(),
|
||||
id: user.id,
|
||||
email: user.email,
|
||||
name: user.name,
|
||||
};
|
||||
},
|
||||
}),
|
||||
],
|
||||
callbacks: {
|
||||
async jwt({ token, user, account }) {
|
||||
return {
|
||||
...token,
|
||||
};
|
||||
},
|
||||
async session({ session, token }) {
|
||||
const documensoSession: Session = {
|
||||
...session,
|
||||
user: {
|
||||
...session.user,
|
||||
},
|
||||
};
|
||||
|
||||
documensoSession.expires;
|
||||
return documensoSession;
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user