0ct0pu5/pangolin
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

show qr code in share link and add version to footer

Browse source
This commit is contained in:
Milo Schwartz 2024-12-24 12:06:13 -05:00
parent 9e50a580a5
commit ccc2e3358c
No known key found for this signature in database
8 changed files with 104 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "@fossorial/pangolin", "name": "@fossorial/pangolin",
"version": "0.1.0", "version": "1.0.0",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {

11
server/config.ts
View file

@ -132,6 +132,17 @@ if (!parsedConfig.success) {
throw new Error(`Invalid configuration file: ${errors}`); throw new Error(`Invalid configuration file: ${errors}`);
} }
const packageJsonPath = path.join(__DIRNAME, "..", "package.json");
let packageJson: any;
if (fs.existsSync && fs.existsSync(packageJsonPath)) {
const packageJsonContent = fs.readFileSync(packageJsonPath, "utf8");
packageJson = JSON.parse(packageJsonContent);
if (packageJson.version) {
process.env.APP_VERSION = packageJson.version;
}
}
process.env.NEXT_PORT = parsedConfig.data.server.next_port.toString(); process.env.NEXT_PORT = parsedConfig.data.server.next_port.toString();
process.env.SERVER_EXTERNAL_PORT = process.env.SERVER_EXTERNAL_PORT =
parsedConfig.data.server.external_port.toString(); parsedConfig.data.server.external_port.toString();

2
src/app/[orgId]/settings/general/page.tsx
View file

@ -139,7 +139,7 @@ export default function GeneralPage() {
</form> </form>
</Form> </Form>
<Card className="border-red-900"> <Card>
<CardHeader> <CardHeader>
<CardTitle className="flex items-center gap-2 text-red-600"> <CardTitle className="flex items-center gap-2 text-red-600">
<AlertTriangle className="h-5 w-5" /> <AlertTriangle className="h-5 w-5" />

13
src/app/[orgId]/settings/share-links/components/CreateShareLinkForm.tsx
View file

@ -63,6 +63,7 @@ import { Checkbox } from "@app/components/ui/checkbox";
import { GenerateAccessTokenResponse } from "@server/routers/accessToken"; import { GenerateAccessTokenResponse } from "@server/routers/accessToken";
import { constructShareLink } from "@app/lib/shareLinks"; import { constructShareLink } from "@app/lib/shareLinks";
import { ShareLinkRow } from "./ShareLinksTable"; import { ShareLinkRow } from "./ShareLinksTable";
import { QRCodeSVG } from "qrcode.react";
type FormProps = { type FormProps = {
open: boolean; open: boolean;
@ -448,15 +449,25 @@ export default function CreateShareLinkForm({
{link && ( {link && (
<div className="max-w-md space-y-4"> <div className="max-w-md space-y-4">
<p> <p>
You will be able to see this link once. You will only be able to see this link once.
Make sure to copy it. Make sure to copy it.
</p> </p>
<p> <p>
Anyone with this link can access the Anyone with this link can access the
resource. Share it with care. resource. Share it with care.
</p> </p>
<div className="w-64 h-64 mx-auto flex items-center justify-center">
<QRCodeSVG
value={link}
size={256}
/>
</div>
<div className="mx-auto">
<CopyTextBox text={link} wrapText={false} /> <CopyTextBox text={link} wrapText={false} />
</div> </div>
</div>
)} )}
</div> </div>
</CredenzaBody> </CredenzaBody>

15
src/app/layout.tsx
View file

@ -4,6 +4,7 @@ import { Figtree } from "next/font/google";
import { Toaster } from "@/components/ui/toaster"; import { Toaster } from "@/components/ui/toaster";
import { ThemeProvider } from "@app/providers/ThemeProvider"; import { ThemeProvider } from "@app/providers/ThemeProvider";
import EnvProvider from "@app/providers/EnvProvider"; import EnvProvider from "@app/providers/EnvProvider";
import { Separator } from "@app/components/ui/separator";
export const metadata: Metadata = { export const metadata: Metadata = {
title: `Dashboard - Pangolin`, title: `Dashboard - Pangolin`,
@ -17,6 +18,8 @@ export default async function RootLayout({
}: Readonly<{ }: Readonly<{
children: React.ReactNode; children: React.ReactNode;
}>) { }>) {
const version = process.env.APP_VERSION;
return ( return (
<html suppressHydrationWarning> <html suppressHydrationWarning>
<body className={`${font.className}`}> <body className={`${font.className}`}>
@ -40,8 +43,11 @@ export default async function RootLayout({
{children} {children}
<footer className="w-full mt-6 py-3"> <footer className="w-full mt-6 py-3">
<div className="container mx-auto flex justify-center items-center px-3 sm:px-0 text-sm text-neutral-300 dark:text-neutral-700 space-x-3 select-none"> <div className="container mx-auto flex justify-center items-center h-5 space-x-4 text-sm text-neutral-400 select-none">
<div>Built by Fossorial</div> <div>Built by Fossorial</div>
<Separator orientation="vertical" />
<div className="flex items-center space-x-3">
<div>Open Source</div>
<a <a
href="https://github.com/fosrl/pangolin" href="https://github.com/fosrl/pangolin"
target="_blank" target="_blank"
@ -58,6 +64,13 @@ export default async function RootLayout({
</svg> </svg>
</a> </a>
</div> </div>
{version && (
<>
<Separator orientation="vertical" />
<div>v{version}</div>
</>
)}
</div>
</footer> </footer>
</EnvProvider> </EnvProvider>
<Toaster /> <Toaster />

6
src/components/Enable2FaForm.tsx
View file

@ -203,11 +203,11 @@ export default function Enable2FaForm({ open, setOpen }: Enable2FaProps) {
{step === 2 && ( {step === 2 && (
<div className="space-y-4"> <div className="space-y-4">
<p> <p>
Scan this QR code with your authenticator app or scan this qr code with your authenticator app or
enter the secret key manually: enter the secret key manually:
</p> </p>
<div className="w-64 h-64 mx-auto flex items-center justify-center"> <div classname="w-64 h-64 mx-auto flex items-center justify-center">
<QRCodeSVG value={secretKey} size={256} /> <qrcodesvg value={secretkey} size={256} />
</div> </div>
<div className="max-w-md mx-auto"> <div className="max-w-md mx-auto">
<CopyTextBox <CopyTextBox

2
src/components/LoginForm.tsx
View file

@ -178,7 +178,7 @@ export default function LoginForm({ redirect, onLogin }: LoginFormProps) {
href={`/auth/reset-password${form.getValues().email ? `?email=${form.getValues().email}` : ""}`} href={`/auth/reset-password${form.getValues().email ? `?email=${form.getValues().email}` : ""}`}
className="text-sm text-muted-foreground" className="text-sm text-muted-foreground"
> >
Forgot password? Click here Forgot password?
</Link> </Link>
</div> </div>
</div> </div>

43
src/components/ui/input.tsx
View file

@ -1,14 +1,27 @@
import * as React from "react" import * as React from "react";
import { cn } from "@/lib/utils" import { cn } from "@/lib/utils";
import { EyeOff, Eye } from "lucide-react";
export type InputProps = React.InputHTMLAttributes<HTMLInputElement>; export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
const Input = React.forwardRef<HTMLInputElement, InputProps>( const Input = React.forwardRef<HTMLInputElement, InputProps>(
({ className, type, ...props }, ref) => { ({ className, type, ...props }, ref) => {
const [showPassword, setShowPassword] = React.useState(false);
const togglePasswordVisibility = () => setShowPassword(!showPassword);
console.log("type", type);
return ( return (
<div className="relative">
<input <input
type={type} type={
type === "password"
? showPassword
? "text"
: "password"
: type
}
className={cn( className={cn(
"flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50", "flex h-9 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
className className
@ -16,9 +29,25 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
ref={ref} ref={ref}
{...props} {...props}
/> />
) {type === "password" && (
<div className="absolute inset-y-0 right-0 flex cursor-pointer items-center pr-3 text-gray-400">
{showPassword ? (
<EyeOff
className="h-4 w-4"
onClick={togglePasswordVisibility}
/>
) : (
<Eye
className="h-4 w-4"
onClick={togglePasswordVisibility}
/>
)}
</div>
)}
</div>
);
} }
) );
Input.displayName = "Input" Input.displayName = "Input";
export { Input } export { Input };