sr2/link-stack
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Middleware and login updates

Browse source
This commit is contained in:
Darren Clarke 2023-02-22 13:05:52 +00:00
parent 484e8689a4
commit 4517241ead
23 changed files with 144 additions and 112 deletions
Download patch file Download diff file Expand all files Collapse all files

2
apps/link/.dockerignore Normal file
View file

@ -0,0 +1,2 @@
node_modules
.next

14
apps/link/components/Sidebar.tsx
View file

@ -24,6 +24,7 @@ import { useRouter } from "next/router";
import Link from "next/link";
import Image from "next/image";
import LinkLogo from "public/link-logo-small.png";
import { useSession } from "next-auth/react";
const openWidth = 270;
const closedWidth = 100;
@ -152,7 +153,8 @@ interface SidebarProps {
export const Sidebar: FC<SidebarProps> = ({ open, setOpen }) => {
const { pathname } = useRouter();
const [username, setUsername] = useState("Nicholas Smith");
const { data: session } = useSession()
const username = session?.user?.name || "User"
return (
<Drawer
@ -273,9 +275,9 @@ export const Sidebar: FC<SidebarProps> = ({ open, setOpen }) => {
{open
? username
: username
.split(" ")
.map((name) => name.substring(0, 1))
.join("")}
.split(" ")
.map((name) => name.substring(0, 1))
.join("")}
</Typography>
</Grid>
<Grid item>
@ -384,10 +386,10 @@ export const Sidebar: FC<SidebarProps> = ({ open, setOpen }) => {
/>
<MenuItem
name="New Ticket UI"
href="/tickets/181"
href="/tickets/2"
Icon={SettingsIcon}
iconSize={0}
selected={pathname.endsWith("/tickets/181")}
selected={pathname.endsWith("/tickets/2")}
open={open}
/>
</List>

14
apps/link/components/ZammadWrapper.tsx
View file

@ -2,24 +2,26 @@ import { FC, useState } from "react";
import Iframe from "react-iframe";
type ZammadWrapperProps = {
url: string;
path: string;
hideSidebar?: boolean;
};
export const ZammadWrapper: FC<ZammadWrapperProps> = ({
url,
path,
hideSidebar = true,
}) => {
const [display, setDisplay] = useState("inherit");
const [display, setDisplay] = useState("hidden");
const url = `https://redaranj-bookish-tribble-56jwjx5wh4j4w-8003.preview.app.github.dev/zammad${path}`;
console.log({ base: process.env.LINK_URL, path, url })
return (
<Iframe
< Iframe
id="link"
url={url}
width="100%"
height="100%"
frameBorder={0}
styles={{ display }}
styles={{ display }
}
onLoad={() => {
const linkElement = document.querySelector("iframe");
if (

32
apps/link/middleware.ts
View file

@ -1,19 +1,31 @@
// middleware.ts
import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
import { withAuth } from "next-auth/middleware"
// This function can be marked `async` if using `await` inside
export function middleware(request: NextRequest) {
export default withAuth((request: NextRequest) => {
if (request.nextUrl.pathname.startsWith('/login')) {
return NextResponse.next()
}
// @ts-expect-error
if (!request.nextauth.token) {
return NextResponse.redirect("/login")
}
// @ts-expect-error
console.log({ token: request.nextauth.token })
console.log("INTO middleware")
const path = request.nextUrl.pathname
console.log({ path })
if (path.startsWith('/zammad')) {
console.log("INTO middleware 2")
const zammadPaths = ['/zammad', '/assets', '/api/v1', '/auth/sso'];
if (zammadPaths.some((p) => path.startsWith(p))) {
console.log("MATCHED ZAMMAD PATH")
const finalURL = new URL(path.replace("/zammad", ""), process.env.ZAMMAD_URL)
console.log(finalURL.toString())
const requestHeaders = new Headers()
requestHeaders.set('X-Forwarded-User', 'darren@redaranj.com')
const requestHeaders = new Headers(request.headers)
// @ts-expect-error
requestHeaders.set('X-Forwarded-User', request.nextauth.token?.email)
requestHeaders.set('Host', 'zammad.example.com')
console.log(requestHeaders)
@ -23,7 +35,11 @@ export function middleware(request: NextRequest) {
}
})
} else {
console.log("INTO middleware 3")
console.log("DID NOT MATCH ZAMMAD PATH")
return NextResponse.next()
}
}
}, {
pages: {
signIn: '/login',
}
})

25
apps/link/next.config.js
View file

@ -3,6 +3,7 @@ module.exports = {
locales: ["en", "fr"],
defaultLocale: "en",
},
/*
async redirects() {
return [
{
@ -13,15 +14,17 @@ module.exports = {
];
},
async rewrites() {
return [
{
source: "/zammad",
destination: `http://link-shell-zammad-proxy-1:3000`,
},
{
source: "/zammad/:path*",
destination: `http://link-shell-zammad-proxy-1:3000/:path*`,
},
];
},
return {
beforeFiles: [
{
source: "/assets/:path*",
destination: `/zammad/assets/:path*`,
},
{
source: "/api/v1/:path*",
destination: `/zammad/api/v1/:path*`,
},
],
};
}, */
};

2
apps/link/pages/admin/zammad.tsx
View file

@ -22,7 +22,7 @@ const Link = () => (
}}
>
<ZammadWrapper
url="http://localhost:3000/zammad/#manage"
path="/#manage"
hideSidebar={false}
/>
</Grid>

4
apps/link/pages/api/auth/[...nextauth].ts
View file

@ -1,6 +1,6 @@
import NextAuth from "next-auth";
import Google from "next-auth/providers/google";
import Apple from "next-auth/providers/apple";
// import Apple from "next-auth/providers/apple";
export default NextAuth({
providers: [
@ -8,10 +8,12 @@ export default NextAuth({
clientId: process.env.GOOGLE_CLIENT_ID,
clientSecret: process.env.GOOGLE_CLIENT_SECRET,
}),
/*
Apple({
clientId: process.env.APPLE_CLIENT_ID,
clientSecret: process.env.APPLE_CLIENT_SECRET
}),
*/
],
secret: process.env.NEXTAUTH_SECRET,
});

2
apps/link/pages/index.tsx
View file

@ -21,7 +21,7 @@ const Home = () => (
width: "100%",
}}
>
<ZammadWrapper url="https://8003-digiresilienc-linkshell-c2tqwgcccbs.ws-eu86.gitpod.io/zammad/#dashboard" />
<ZammadWrapper path="/#dashboard" />
</Grid>
</Grid>
</Layout>

2
apps/link/pages/link.tsx
View file

@ -21,7 +21,7 @@ const Link = () => (
width: "100%",
}}
>
<ZammadWrapper url="http://localhost:3000/zammad/#ticket/zoom/518/1490" />
<ZammadWrapper path="/zammad/#ticket/zoom/518/1490" />
</Grid>
</Grid>
</Layout>

6
apps/link/pages/login.tsx
View file

@ -40,13 +40,15 @@ const Login = ({ session }) => {
sx={buttonStyles}
onClick={() =>
signIn("google", {
callbackUrl: `${window.location.origin}/setup`,
callbackUrl: `https://redaranj-bookish-tribble-56jwjx5wh4j4w-8003.preview.app.github.dev/auth/sso`,
})
}
>
<GoogleIcon sx={{ mr: 1 }} />
Google
</IconButton>
</Grid>
{/*
<Grid item sx={{ width: "100%" }}>
<IconButton
sx={buttonStyles}
@ -58,7 +60,7 @@ const Login = ({ session }) => {
>
<AppleIcon sx={{ mr: 1 }} />
</IconButton>
</Grid>
</Grid>*/}
<Grid item sx={{ mt: 2 }} />
</Grid>
) : null}

2
apps/link/pages/profile.tsx
View file

@ -22,7 +22,7 @@ const Profile = () => (
}}
>
<ZammadWrapper
url="http://localhost:3000/zammad/#profile"
path="/#profile"
hideSidebar={false}
/>
</Grid>

54
apps/link/pages/tickets/[...id].tsx
View file

@ -1,54 +0,0 @@
import Head from "next/head";
import { NextPage, GetServerSideProps, GetServerSidePropsContext } from "next";
import { Grid, Box } from "@mui/material";
import { Layout } from "components/Layout";
import { TicketDetail } from "components/TicketDetail";
import { TicketEdit } from "components/TicketEdit";
const Link: NextPage = ({ ticket, articles }: any) => (
<Layout>
<Head>
<title>Link Shell</title>
</Head>
<Grid container spacing={0} sx={{ height: "100vh" }} direction="row">
<Grid item sx={{ height: "100vh" }} xs={10}>
<TicketDetail ticket={ticket} articles={articles} />
</Grid>
<Grid item xs={2} sx={{ height: "100vh" }}>
<TicketEdit ticket={ticket} />
</Grid>
</Grid>
</Layout>
);
export const getServerSideProps: GetServerSideProps = async (
context: GetServerSidePropsContext
) => {
const {
params: { id },
} = context;
const baseURL = `${process.env.ZAMMAD_URL}/api/v1`;
const token = process.env.ZAMMAD_API_TOKEN;
const headers = { Authorization: `Token ${token}` };
const rawTicket = await fetch(`${baseURL}/tickets/${id}`, {
headers,
});
const ticket = await rawTicket.json();
const rawArticles = await fetch(
`${baseURL}/ticket_articles/by_ticket/${id}`,
{
headers,
}
);
const articles = await rawArticles.json();
console.log({ ticket, articles });
return {
props: {
ticket,
articles,
},
};
};
export default Link;

58
apps/link/pages/tickets/[id].tsx Normal file
View file

@ -0,0 +1,58 @@
import { GetServerSideProps, GetServerSidePropsContext } from "next";
import Head from "next/head";
import useSWR from "swr";
import { NextPage } from "next";
import { Grid, } from "@mui/material";
import { Layout } from "components/Layout";
import { TicketDetail } from "components/TicketDetail";
import { TicketEdit } from "components/TicketEdit";
type TicketProps = {
id: string;
};
const Ticket: NextPage<TicketProps> = ({ id }) => {
const fetcher = async (url: string) => {
const res = await fetch(url);
return res.json();
}
const { data: ticketData, error: ticketError } = useSWR(
`https://redaranj-bookish-tribble-56jwjx5wh4j4w-8003.preview.app.github.dev/api/v1/tickets/${id}`,
fetcher
);
const { data: articlesData, error: articlesError } = useSWR(
`https://redaranj-bookish-tribble-56jwjx5wh4j4w-8003.preview.app.github.dev/api/v1/ticket_articles/by_ticket/${id}`,
fetcher
);
const shouldRender = !ticketError && !articlesError && ticketData && articlesData && !ticketData.error && !articlesData.error;
return (
<Layout>
<Head>
<title>Link Shell</title>
</Head>
{shouldRender && (
<Grid container spacing={0} sx={{ height: "100vh" }} direction="row">
<Grid item sx={{ height: "100vh" }} xs={10}>
<TicketDetail ticket={ticketData} articles={articlesData} />
</Grid>
<Grid item xs={2} sx={{ height: "100vh" }}>
<TicketEdit ticket={ticketData} />
</Grid>
</Grid>)}
{ticketError && <div>{ticketError.toString()}</div>}
</Layout>
);
}
export const getServerSideProps: GetServerSideProps = async (
context: GetServerSidePropsContext) => {
const { id } = context.query;
return { props: { id } };
}
export default Ticket;

2
apps/link/pages/tickets/assigned.tsx
View file

@ -21,7 +21,7 @@ const Link = () => (
width: "100%",
}}
>
<ZammadWrapper url="http://localhost:8003/zammad/#ticket/view/my_tickets" />
<ZammadWrapper path="/#ticket/view/my_tickets" />
</Grid>
</Grid>
</Layout>

2
apps/link/pages/tickets/pending.tsx
View file

@ -21,7 +21,7 @@ const Link = () => (
width: "100%",
}}
>
<ZammadWrapper url="http://localhost:3000/zammad/#ticket/view/my_pending_reached" />
<ZammadWrapper path="/#ticket/view/my_pending_reached" />
</Grid>
</Grid>
</Layout>

2
apps/link/pages/tickets/unassigned.tsx
View file

@ -21,7 +21,7 @@ const Link = () => (
width: "100%",
}}
>
<ZammadWrapper url="http://localhost:3000/zammad/#ticket/view/all_unassigned" />
<ZammadWrapper path="/#ticket/view/all_unassigned" />
</Grid>
</Grid>
</Layout>

2
apps/link/pages/tickets/urgent.tsx
View file

@ -21,7 +21,7 @@ const Link = () => (
width: "100%",
}}
>
<ZammadWrapper url="http://localhost:3000/zammad/#ticket/view/all_escalated" />
<ZammadWrapper path="/#ticket/view/all_escalated" />
</Grid>
</Grid>
</Layout>