Skip to content

Commit

Permalink
layout
Browse files Browse the repository at this point in the history
  • Loading branch information
@potts99
potts99 committed Dec 14, 2023
1 parent ef6faff commit 4863443
Show file tree
Hide file tree
Showing 3 changed files with 153 additions and 57 deletions.
1 change: 1 addition & 0 deletions apps/client/layouts/adminLayout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ export default function AdminLayout({ children }: any) {
))}
</nav>
</div>

<div className="flex-1 px-6 xl:w-[800px] ">{children}</div>
</div>
</div>
Expand Down
205 changes: 150 additions & 55 deletions apps/client/layouts/newLayout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import Link from "next/link";
import { useRouter } from "next/router";
import { Fragment, useEffect, useState } from "react";

import { ContextMenu } from "@radix-ui/themes";
import { Button, ContextMenu } from "@radix-ui/themes";
import useTranslation from "next-translate/useTranslation";
import { useUser } from "../store/session";

Expand All @@ -33,7 +33,6 @@ export default function NewLayout({ children }: any) {

const [sidebarOpen, setSidebarOpen] = useState(false);
const [tab, setTab] = useState("unread");
const [currentPath, setCurrentPath] = useState();

if (!user) {
location.push("/auth/login");
Expand Down Expand Up @@ -76,6 +75,39 @@ export default function NewLayout({ children }: any) {
// },
];

const admin_settings = [
{
name: t("sl_users"),
href: "/admin/users/internal",
current: location.pathname === "/admin/users/internal",
},
{
name: t("sl_clients"),
href: "/admin/clients",
current: location.pathname === "/admin/clients",
},
{
name: "Email Queues",
href: "/admin/email-queues",
current: location.pathname === "/admin/email-queues",
},
{
name: "Webhooks",
href: "/admin/webhooks",
current: location.pathname === "/admin/webhooks",
},
{
name: "Outbound Emails",
href: "/admin/email",
current: location.pathname === "/admin/email",
},
{
name: "SSO",
href: "/admin/sso",
current: location.pathname === "/admin/sso",
},
];

// async function getQueues() {
// const res = await fetch(
// `/api/v1/email-queues/all`,
Expand Down Expand Up @@ -115,46 +147,7 @@ export default function NewLayout({ children }: any) {

// useEffect(() => {
// getQueues();
// }, [user]);

// useEffect(() => {
// location.push(`${locale}/${location.pathname}`);
// }, [user, location]);

// const handleKeyPress = useCallback((event: any, location: any) => {
// console.log(location);
// if (
// document.activeElement!.tagName !== "INPUT" &&
// document.activeElement!.tagName !== "TEXTAREA" &&
// !document.activeElement!.className.includes("ProseMirror")
// ) {
// switch (event.key) {
// case "c":
// location.push("/new");
// break;
// case "h":
// location.push("/");
// break;
// case "n":
// location.push("/notebook");
// break;
// case "t":
// location.push("/tickets");
// break;
// case "a":
// location.push("/admin");
// break;
// case "o":
// location.push("/tickets/open");
// break;
// case "f":
// location.push("/tickets/closed");
// break;
// default:
// break;
// }
// }
// }, []);
// }, [user])

function handleKeyPress(event: any) {
const pathname = location.pathname;
Expand Down Expand Up @@ -260,12 +253,13 @@ export default function NewLayout({ children }: any) {
</Transition.Child>
{/* Sidebar component, swap this element with another sidebar if you like */}
<div className="flex grow flex-col gap-y-5 overflow-y-auto bg-white px-6 pb-4">
<div className="flex h-16 shrink-0 items-center">
<img
className="h-8 w-auto"
src="https://tailwindui.com/img/logos/mark.svg?color=indigo&shade=600"
alt="Your Company"
/>
<div className="flex align-middle flex-row h-14 items-center border-b-[1px]">
{/* <img className="h-8 w-auto" src="/logo.svg" alt="Workflow" /> */}
<Link href="https://peppermint.sh">
<span className="text-3xl ml-2 hover:text-green-600 font-bold ">
Peppermint
</span>
</Link>
</div>
<nav className="flex flex-1 flex-col">
<ul role="list" className="flex flex-1 flex-col gap-y-7">
Expand Down Expand Up @@ -295,11 +289,6 @@ export default function NewLayout({ children }: any) {
<span className="whitespace-nowrap">
{item.name}
</span>
<div className="flex w-full justify-end float-right">
<span className="flex h-6 w-6 shrink-0 items-center justify-center rounded-lg border border-gray-700 bg-gray-800 text-[0.625rem] font-medium text-gray-400 group-hover:text-white">
{item.initial}
</span>
</div>
</Link>
</li>
) : (
Expand Down Expand Up @@ -363,6 +352,100 @@ export default function NewLayout({ children }: any) {
</ul>
</li>

{user.isAdmin && (
<li>
<span className="mb-2 text-sm font-bold">
Admin Settings
</span>
<ul role="list" className="-mx-2 space-y-1">
{admin_settings.map((item: any) =>
!item.children ? (
<li key={item.name}>
<Link
href={item.href}
className={classNames(
item.current
? "bg-gray-50 text-indigo-600"
: "text-gray-700 hover:text-indigo-600 hover:bg-gray-50",
"group flex gap-x-3 rounded-md p-2 text-sm leading-6 font-semibold"
)}
>
{/* <item.icon
className={classNames(
item.current
? "text-indigo-600"
: "text-gray-400 group-hover:text-indigo-600",
"h-6 w-6 shrink-0"
)}
aria-hidden="true"
/> */}
<span className="whitespace-nowrap">
{item.name}
</span>
</Link>
</li>
) : (
<Disclosure
as="div"
key={item.name}
className="space-y-1"
>
{({ open }) => (
<>
{queues.length > 0 && (
<>
<Disclosure.Button
className={classNames(
item.current
? "bg-green-400 text-white"
: "bg-gray-900 text-white hover:bg-green-400 hover:text-white",
"group w-full flex items-center pl-2 pr-2 py-2 text-left text-sm font-medium rounded-md focus:outline-none"
)}
>
<svg
className={classNames(
open
? "text-white rotate-90"
: "text-white",
"mr-2 flex-shrink-0 h-5 w-5 transform group-hover:text-white transition-colors ease-in-out duration-150"
)}
viewBox="0 0 20 20"
aria-hidden="true"
>
<path
d="M6 6L14 10L6 14V6Z"
fill="currentColor"
/>
</svg>
{item.name}
</Disclosure.Button>
<Disclosure.Panel className="space-y-1">
{item.children.map(
(subItem: any) => (
<Link
href={`/queue/${subItem.name}`}
>
<Disclosure.Button
key={subItem.name}
className="group w-full flex items-center pl-10 pr-2 py-2 text-sm font-medium text-white rounded-md hover:text-white hover:bg-green-400 focus:outline-none"
>
{subItem.name}
</Disclosure.Button>
</Link>
)
)}
</Disclosure.Panel>
</>
)}
</>
)}
</Disclosure>
)
)}
</ul>
</li>
)}

<li className="mt-auto">
<a
href="#"
Expand Down Expand Up @@ -569,11 +652,14 @@ export default function NewLayout({ children }: any) {
<div className="sticky top-0 z-10 flex h-14 shrink-0 items-center gap-x-4 border-b border-gray-200 bg-white dark:bg-[#0A090C] px-4 sm:gap-x-6">
<button
type="button"
className="-m-2.5 p-2.5 text-white lg:hidden"
className="-m-2.5 p-2.5 text-black dark:text-whitelg:hidden"
onClick={() => setSidebarOpen(true)}
>
<span className="sr-only">Open sidebar</span>
<Bars3Icon className="h-6 w-6 text-white" aria-hidden="true" />
<Bars3Icon
className="h-6 w-6 text-black dark:text-white"
aria-hidden="true"
/>
</button>

{/* Separator */}
Expand Down Expand Up @@ -697,6 +783,15 @@ export default function NewLayout({ children }: any) {
</Popover.Panel>
</Popover> */}
{/* Profile dropdown */}
<Link
href="https://github.com/Peppermint-Lab/peppermint/discussions"
target="_blank"
className="hover:cursor-pointer"
>
<Button variant="outline" className="hover:cursor-pointer">
Send Feedback
</Button>
</Link>
<Menu as="div" className="relative">
<Menu.Button className="z-50 flex items-center p-1.5">
<span className="sr-only">Open user menu</span>
Expand Down
4 changes: 2 additions & 2 deletions apps/client/pages/auth/login.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -80,13 +80,13 @@ export default function Login({}) {
return (
<div className="min-h-screen bg-gray-50 flex flex-col justify-center py-12 sm:px-6 lg:px-8">
<div className="sm:mx-auto sm:w-full sm:max-w-md">
<a target="_blank" href="https://peppermint.sh/">
{/* <a target="_blank" href="https://peppermint.sh/">
<img
className="mx-auto h-36 w-auto"
src="/login.svg"
alt="peppermint.sh logo"
/>
</a>
</a> */}
<h2 className="mt-6 text-center text-3xl font-extrabold text-gray-900">
Sign in to your account
</h2>
Expand Down

0 comments on commit 4863443

Please sign in to comment.