change when the action menu buttons are shown

This commit is contained in:
Lee 2024-04-24 17:35:25 +01:00
parent e9f63a369d
commit b5f4b39feb
4 changed files with 24 additions and 28 deletions

@ -1,10 +1,12 @@
import { cache, ReactElement } from "react"; import React, { cache, ReactElement } from "react";
import { ActionMenu } from "@/app/components/action-menu"; import { ActionMenu } from "@/app/components/action-menu";
import { Metadata } from "next"; import { Metadata } from "next";
import moment from "moment"; import moment from "moment";
import { notFound } from "next/navigation"; import { notFound } from "next/navigation";
import { CodeBlock } from "@/app/components/code-block"; import { CodeBlock } from "@/app/components/code-block";
import { detectLanguage } from "@/app/common/lang-detection/detection"; import { detectLanguage } from "@/app/common/lang-detection/detection";
import { Button } from "@/app/components/ui/button";
import Link from "next/link";
type PasteProps = { type PasteProps = {
params: { params: {
@ -59,13 +61,10 @@ export async function generateMetadata({
description: "Not found", description: "Not found",
}; };
} }
const created = moment(data.created)
.format("MMMM Do YYYY, h:mm:ss a")
.toString();
return { return {
title: `Paste - ${id}.${data.language}`, title: `Paste - ${id}.${data.language}`,
description: `Created: ${created}\n\nClick to view the paste.`, description: `Click to view the paste.`,
}; };
} }
@ -84,9 +83,11 @@ export default async function Paste({
return ( return (
<div className="relative h-full"> <div className="relative h-full">
<div className="absolute top-0 right-0 flex flex-col items-end mx-3 mt-2"> <ActionMenu>
<ActionMenu /> <Link href={"/"}>
</div> <Button>New</Button>
</Link>
</ActionMenu>
<div className="absolute right-0 bottom-0 text-right p-1.5"> <div className="absolute right-0 bottom-0 text-right p-1.5">
<p>{data.language}</p> <p>{data.language}</p>

@ -60,7 +60,6 @@ export default function Home(): ReactElement {
/> />
</div> </div>
<div className="absolute top-0 right-0 mx-3 mt-2 ">
<ActionMenu> <ActionMenu>
<Button onClick={() => createPaste()} className="flex gap-1"> <Button onClick={() => createPaste()} className="flex gap-1">
{creating && ( {creating && (
@ -72,6 +71,5 @@ export default function Home(): ReactElement {
</Button> </Button>
</ActionMenu> </ActionMenu>
</div> </div>
</div>
); );
} }

@ -1,6 +1,4 @@
import React from "react"; import React from "react";
import { Button } from "@/app/components/ui/button";
import Link from "next/link";
type ActionMenuProps = { type ActionMenuProps = {
children?: React.ReactNode; children?: React.ReactNode;
@ -8,11 +6,10 @@ type ActionMenuProps = {
export function ActionMenu({ children }: ActionMenuProps) { export function ActionMenu({ children }: ActionMenuProps) {
return ( return (
<div className="absolute top-0 right-0 flex flex-col items-end mx-3 mt-2">
<div className="flex items-center bg-secondary rounded-md p-2 gap-2"> <div className="flex items-center bg-secondary rounded-md p-2 gap-2">
{children} {children}
<Link href={"/"}> </div>
<Button>New</Button>
</Link>
</div> </div>
); );
} }

@ -20,7 +20,7 @@ export function CodeBlock({ code, language }: CodeBlockProps): ReactElement {
<SyntaxHighlighter <SyntaxHighlighter
className="!bg-transparent text-xs" className="!bg-transparent text-xs"
style={atomOneDark} style={atomOneDark}
language={language} language={language == "text" ? "plaintext" : language}
showLineNumbers showLineNumbers
codeTagProps={{ codeTagProps={{
style: { style: {