Skip to content

Commit

Permalink
stashed changes
Browse files Browse the repository at this point in the history
  • Loading branch information
steven-tey committed Apr 28, 2023
1 parent adc20a5 commit a51f85e
Show file tree
Hide file tree
Showing 32 changed files with 3,159 additions and 139 deletions.
2 changes: 2 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -39,3 +39,5 @@ next-env.d.ts
/pages/api/scripts*
deleted-projects.json
.mailing
.contentlayer
.vscode
121 changes: 121 additions & 0 deletions app/(marketing)/changelog/[slug]/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
import type { Metadata } from "next";
import { notFound } from "next/navigation";
import { allPosts } from "contentlayer/generated";
import { MDX } from "@/components/shared/mdx";
import Link from "next/link";
import { ArrowLeft } from "lucide-react";
import { formatDate } from "@/lib/utils";
import { getBlurDataURL, getImages } from "@/lib/images";
import getTweets from "@/lib/twitter";
import BlurImage from "@/components/shared/blur-image";
import getRepos from "@/lib/github";

export async function generateStaticParams() {
return allPosts.map((post) => ({
slug: post.slug,
}));
}

export async function generateMetadata({
params,
}: {
params: { slug: string };
}): Promise<Metadata | undefined> {
const post = allPosts.find((post) => post.slug === params.slug);
if (!post) {
return;
}

const {
title,
publishedAt: publishedTime,
summary: description,
image,
slug,
} = post;

return {
title,
description,
openGraph: {
title,
description,
type: "article",
publishedTime,
url: `https://dub.sh/changelog/${slug}`,
images: [
{
url: image,
},
],
},
twitter: {
card: "summary_large_image",
title,
description,
images: [image],
},
};
}

export default async function ChangelogPost({
params,
}: {
params: { slug: string };
}) {
const post = allPosts.find((post) => post.slug === params.slug);
if (!post) {
notFound();
}

const [images, tweets, repos] = await Promise.all([
getImages(post.images),
getTweets(post.tweetIds),
getRepos(post.githubRepos),
]);

return (
<div className="lg:relative">
<div className="mx-auto mb-20 max-w-2xl">
<Link
href="/blog"
className="group ml-5 mb-8 flex h-10 w-10 items-center justify-center rounded-full bg-white shadow-md shadow-zinc-800/5 ring-1 ring-zinc-900/5 transition sm:ml-0 lg:absolute lg:-left-5 lg:mb-0 lg:-mt-2 xl:-top-1.5 xl:left-0 xl:mt-0"
>
<span className="sr-only">Back to blog</span>
<ArrowLeft className="h-4 w-4 stroke-zinc-500 transition group-hover:stroke-zinc-700" />
</Link>
<div>
<div className="mx-5 flex flex-col sm:mx-auto">
<h1 className="mt-6 font-display text-4xl font-bold tracking-tight text-zinc-800 sm:text-5xl">
{post.title}
</h1>
<time
dateTime={post.publishedAt}
className="order-first flex items-center text-base text-zinc-500"
>
<span className="h-4 w-0.5 rounded-full bg-zinc-200" />
<span className="ml-3">{formatDate(post.publishedAt)}</span>
</time>
</div>
<BlurImage
src={post.image}
alt={post.title}
width={1200}
height={900}
priority // since it's above the fold
placeholder="blur"
blurDataURL={await getBlurDataURL(post.image!)}
className="my-10 sm:rounded-3xl"
/>

<MDX
code={post.body.code}
images={images}
tweets={tweets}
repos={repos}
/>
</div>
</div>
</div>
);
}
3 changes: 3 additions & 0 deletions app/(marketing)/changelog/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export default function Changelog() {
return <div></div>;
}
83 changes: 83 additions & 0 deletions app/(marketing)/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,83 @@
import Image from "next/image";
import Link from "next/link";
import { Github, Logo, Twitter } from "@/components/shared/icons";
import NavigationMenu from "./navigation-menu";

const title = "Dub - Link Management for Modern Marketing Teams";
const description =
"Dub is an open-source link management tool for modern marketing teams to create, share, and track short links.";

export const metadata = {
title,
description,
twitter: {
card: "summary_large_image",
title,
description,
creator: "@dubdotsh",
},
metadataBase: new URL("https://dub.sh"),
themeColor: "#FFF",
};

export default function MarketingLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<div className="flex min-h-screen flex-col justify-between">
<div className="z-20">
<div className="mx-auto max-w-screen-xl px-5 md:px-20">
<div className="flex h-16 items-center justify-between">
<div className="flex items-center">
<Link href="/">
<Image
src="/_static/logotype.svg"
alt="Dub.sh logo"
width={834}
height={236}
className="w-24"
/>
</Link>
</div>

<NavigationMenu />

<div className="w-24">
<Link
href={
process.env.NEXT_PUBLIC_VERCEL_ENV === "production"
? "https://app.dub.sh/login"
: "http://app.localhost:3000/login"
}
className="rounded-full border border-black bg-black py-1.5 px-5 text-sm text-white transition-all hover:bg-white hover:text-black"
>
Sign in
</Link>
</div>
</div>
</div>
</div>
{children}
<div className="z-10 flex h-20 items-center justify-center space-x-12 border-t border-gray-200">
<a href="https://twitter.com/dubdotsh" target="_blank" rel="noreferrer">
<span className="sr-only">Twitter</span>
<Twitter className="h-6 w-6 text-gray-600" />
</a>
<Link href="/">
<span className="sr-only">Dub.sh Logo</span>
<Logo className="h-7 w-7 text-gray-600" />
</Link>
<a
href="https://github.com/steven-tey/dub"
target="_blank"
rel="noreferrer"
>
<span className="sr-only">Github</span>
<Github className="h-6 w-6 text-gray-600" />
</a>
</div>
</div>
);
}
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
"use client";

import { ChevronDown } from "@/components/shared/icons";
import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
import clsx from "classnames";
Expand Down Expand Up @@ -111,7 +113,7 @@ export default function NavigationMenu() {

<NavigationMenuPrimitive.Item asChild>
<NavigationMenuPrimitive.Link
href="/pricing"
href="/#pricing"
className={clsx(
"rounded-md px-3 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-900",
"text-sm font-medium text-gray-700 dark:text-gray-100",
Expand All @@ -135,13 +137,13 @@ export default function NavigationMenu() {

<NavigationMenuPrimitive.Item asChild>
<NavigationMenuPrimitive.Link
href="/docs"
href="/changelog"
className={clsx(
"rounded-md px-3 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-900",
"text-sm font-medium text-gray-700 dark:text-gray-100",
)}
>
Docs
Changelog
</NavigationMenuPrimitive.Link>
</NavigationMenuPrimitive.Item>

Expand Down
Binary file added app/favicon.ico
Binary file not shown.
19 changes: 19 additions & 0 deletions app/layout.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import "@/styles/globals.css";
import { satoshi, inter } from "@/styles/fonts";
import { Analytics } from "@vercel/analytics/react";
import cx from "classnames";

export default async function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en">
<body className={cx(satoshi.variable, inter.variable)}>
{children}
<Analytics />
</body>
</html>
);
}
18 changes: 13 additions & 5 deletions components/app/modals/link-qr-modal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ import IconMenu from "@/components/shared/icon-menu";
import { Download, Photo } from "@/components/shared/icons";
import Popover from "@/components/shared/popover";
import toast from "react-hot-toast";
import { useSession } from "next-auth/react";

function LinkQRModalHelper({
showLinkQRModal,
Expand All @@ -31,7 +30,7 @@ function LinkQRModalHelper({
setShowLinkQRModal: Dispatch<SetStateAction<boolean>>;
props: SimpleLinkProps;
}) {
const anchorRef = useRef<HTMLAnchorElement>();
const anchorRef = useRef<HTMLAnchorElement>(null);
const { logo } = useProject();
const { avatarUrl, apexDomain } = useMemo(() => {
try {
Expand All @@ -41,7 +40,10 @@ function LinkQRModalHelper({
apexDomain,
};
} catch (e) {
return null;
return {
avatarUrl: null,
apexDomain: null,
};
}
}, [props]);

Expand Down Expand Up @@ -88,6 +90,7 @@ function LinkQRModalHelper({
try {
const canvas = await getQRAsCanvas(qrData, "image/png", true);
(canvas as HTMLCanvasElement).toBlob(async function (blob) {
// @ts-ignore
const item = new ClipboardItem({ "image/png": blob });
await navigator.clipboard.write([item]);
});
Expand Down Expand Up @@ -123,11 +126,16 @@ function LinkQRModalHelper({
fgColor={qrData.fgColor}
level={qrData.level}
includeMargin={false}
// @ts-ignore
imageSettings={
showLogo && {
...qrData.imageSettings,
height: qrData.imageSettings.height / 8,
width: qrData.imageSettings.width / 8,
height: qrData.imageSettings
? qrData.imageSettings.height / 8
: 0,
width: qrData.imageSettings
? qrData.imageSettings.width / 8
: 0,
}
}
/>
Expand Down
2 changes: 2 additions & 0 deletions components/home/demo.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
"use client";

import { useState } from "react";
import { motion } from "framer-motion";
import { Toaster } from "react-hot-toast";
Expand Down
2 changes: 2 additions & 0 deletions components/home/features.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
"use client";

import Link from "next/link";
import { Airplay, Chart, QR, Users, Photo } from "@/components/shared/icons";
import MaxWidthWrapper from "@/components/shared/max-width-wrapper";
Expand Down
2 changes: 2 additions & 0 deletions components/home/globe.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
"use client";

import Link from "next/link";
import { useEffect, useRef, useState } from "react";
import createGlobe from "cobe";
Expand Down
8 changes: 4 additions & 4 deletions components/home/hero.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { Github, Twitter } from "@/components/shared/icons";
const Hero = () => {
return (
<div className="mx-auto mt-20 mb-10 max-w-md px-2.5 text-center sm:max-w-lg sm:px-0">
<a
<Link
href="https://dub.sh/launch"
target="_blank"
rel="noreferrer"
Expand All @@ -14,7 +14,7 @@ const Hero = () => {
<p className="text-sm font-semibold text-[#1d9bf0]">
Introducing Dub.sh
</p>
</a>
</Link>

<h1 className="mt-5 font-display text-5xl font-extrabold leading-[1.15] text-black sm:text-6xl sm:leading-[1.15]">
Short Links With
Expand All @@ -35,15 +35,15 @@ const Hero = () => {
>
Start For Free
</Link>
<a
<Link
className="flex items-center justify-center space-x-2 rounded-full border border-gray-300 bg-white py-2 px-5 shadow-lg transition-all hover:border-gray-800"
href="https://dub.sh/github"
target="_blank"
rel="noreferrer"
>
<Github className="h-5 w-5 text-black" />
<p className="text-sm">Star on GitHub</p>
</a>
</Link>
</div>
</div>
);
Expand Down
2 changes: 2 additions & 0 deletions components/home/pricing.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
"use client";

import Link from "next/link";
import { useMemo, useState } from "react";
import Confetti from "react-dom-confetti";
Expand Down
2 changes: 1 addition & 1 deletion components/layout/home/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { Github, Logo, Twitter } from "@/components/shared/icons";
import Meta from "../meta";
import { motion, AnimatePresence } from "framer-motion";
import { FADE_IN_ANIMATION_SETTINGS } from "@/lib/constants";
import NavigationMenu from "./navigation-menu";
import NavigationMenu from "../../../app/(marketing)/navigation-menu";

export default function HomeLayout({
meta,
Expand Down
2 changes: 2 additions & 0 deletions components/shared/blur-image.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
"use client";

import Image, { ImageProps } from "next/image";
import { useEffect, useState } from "react";

Expand Down
Loading

0 comments on commit a51f85e

Please sign in to comment.