From 6018a2235a4982ee0f8d1b6fe05b67def681b5a1 Mon Sep 17 00:00:00 2001 From: Zhenya Goroh Date: Tue, 8 Oct 2024 21:23:27 +0300 Subject: [PATCH 1/6] Refactored mobile-nav component --- src/components/mobile-nav.tsx | 70 +++++++++++++++++++---------------- src/components/navigation.tsx | 4 ++ 2 files changed, 43 insertions(+), 31 deletions(-) diff --git a/src/components/mobile-nav.tsx b/src/components/mobile-nav.tsx index e57f764..9332546 100644 --- a/src/components/mobile-nav.tsx +++ b/src/components/mobile-nav.tsx @@ -12,6 +12,37 @@ import Logo from "./logo"; import { ny } from "@/lib/utils"; import { components } from "./navigation"; +interface MobileLinkProps + extends React.AnchorHTMLAttributes { + onOpenChange?: (open: boolean) => void; + children: React.ReactNode; + className?: string; + href: string; +} + +function MobileLink({ + href, + onOpenChange, + className, + children, + ...props +}: MobileLinkProps) { + const router = useRouter(); + return ( + { + router.push(href); + onOpenChange?.(false); + }} + className={ny(className, "my-4")} + {...props} + > + {children} + + ); +} + export function MobileNav() { const [open, setOpen] = React.useState(false); @@ -60,12 +91,18 @@ export function MobileNav() {
Donate {"<"}3

Support the project

 - {components.map(({ title, href, description }) => ( - + {components.map(({ title, href, description, isTargetBlank }) => ( +
{title}

{description}

 @@ -76,32 +113,3 @@ export function MobileNav() { ); } - -interface MobileLinkProps extends LinkProps { - onOpenChange?: (open: boolean) => void; - children: React.ReactNode; - className?: string; -} - -function MobileLink({ - href, - onOpenChange, - className, - children, - ...props -}: MobileLinkProps) { - const router = useRouter(); - return ( - { - router.push(href.toString()); - onOpenChange?.(false); - }} - className={ny(className, "my-4")} - {...props} - > - {children} - - ); -} diff --git a/src/components/navigation.tsx b/src/components/navigation.tsx index c532e02..236f147 100644 --- a/src/components/navigation.tsx +++ b/src/components/navigation.tsx @@ -21,6 +21,7 @@ export const components: { title: string; href: string; description: string; + isTargetBlank?: boolean; }[] = [ { title: "Privacy Policy", @@ -33,12 +34,14 @@ export const components: { href: "https://discord.gg/zen-browser", description: "Join our Discord server to chat with the community and get support.", + isTargetBlank: true, }, { title: "Source Code", href: "https://github.com/zen-browser", description: "View the source code on GitHub and contribute to the project.", + isTargetBlank: true, }, { title: "Branding Assets", @@ -55,6 +58,7 @@ export const components: { title: "Documentation", href: "https://docs.zen-browser.app/", description: "Read the documentation to learn more about Zen Browser.", + isTargetBlank: true, }, ]; From 548541545d4aa0524a3e1f505c2a2f619dd7c57e Mon Sep 17 00:00:00 2001 From: Zhenya Goroh Date: Tue, 8 Oct 2024 21:28:50 +0300 Subject: [PATCH 2/6] Refactored navigation component --- src/components/navigation.tsx | 127 ++++++++++++++++++---------------- 1 file changed, 66 insertions(+), 61 deletions(-) diff --git a/src/components/navigation.tsx b/src/components/navigation.tsx index 236f147..771bdeb 100644 --- a/src/components/navigation.tsx +++ b/src/components/navigation.tsx @@ -62,6 +62,58 @@ export const components: { }, ]; +const ListItem = React.forwardRef< + React.ElementRef<"a">, + React.ComponentPropsWithoutRef<"a"> +>(({ className, title, children, ...props }, ref) => { + return ( +
  • + + +
    {title}
    +

    + {children} +

    +     +     +
    • + ); +}); +const ListItem2 = React.forwardRef< + React.ElementRef<"a">, + React.ComponentPropsWithoutRef<"a"> +>(({ className, title, children, ...props }, ref) => { + return ( +
  • + + +
    {title}
    +

    + {children} +

    +     +     +
    • + ); +}); +ListItem.displayName = "ListItem"; +ListItem.displayName = "ListItem2"; + export function Navigation() { return (
    @@ -116,6 +168,7 @@ export function Navigation() { Support us on Patreon and get exclusive rewards and keep the project alive. @@ -123,6 +176,7 @@ export function Navigation() { Ko-fi is a way to support us with a one-time donation and help us keep the project alive. @@ -134,15 +188,18 @@ export function Navigation() { {"Useful Links"}
      - {components.map((component) => ( - - {component.description} - - ))} + {components.map( + ({ description, href, title, isTargetBlank }) => ( + + {description} + + ), + )}
    @@ -152,55 +209,3 @@ export function Navigation() {
    ); } - -const ListItem = React.forwardRef< - React.ElementRef<"a">, - React.ComponentPropsWithoutRef<"a"> ->(({ className, title, children, ...props }, ref) => { - return ( -
  • - - -
    {title}
    -

    - {children} -

    -     -     -
    • - ); -}); -const ListItem2 = React.forwardRef< - React.ElementRef<"a">, - React.ComponentPropsWithoutRef<"a"> ->(({ className, title, children, ...props }, ref) => { - return ( -
  • - - -
    {title}
    -

    - {children} -

    -     -     -
    • - ); -}); -ListItem.displayName = "ListItem"; -ListItem.displayName = "ListItem2"; From 588f61a54df46e38dd6e143181adeac6685ce23d Mon Sep 17 00:00:00 2001 From: Zhenya Goroh Date: Tue, 8 Oct 2024 21:30:34 +0300 Subject: [PATCH 3/6] Added target blank to some links --- src/components/branding-assets.tsx | 2 +- src/components/download.tsx | 3 ++- src/components/footer.tsx | 18 +++++++++++------- 3 files changed, 14 insertions(+), 9 deletions(-) diff --git a/src/components/branding-assets.tsx b/src/components/branding-assets.tsx index 9e06330..110f744 100644 --- a/src/components/branding-assets.tsx +++ b/src/components/branding-assets.tsx @@ -75,7 +75,7 @@ export function BrandingAssets() { CC BY-SA 4.0 . Thanks to{" "} - + Donno (mr. Logos) {" "} for the assets. diff --git a/src/components/download.tsx b/src/components/download.tsx index 60786f2..fee9ef2 100644 --- a/src/components/download.tsx +++ b/src/components/download.tsx @@ -227,8 +227,9 @@ export default function DownloadPage() { the web with Zen!

    - Source Code + Source Code diff --git a/src/components/footer.tsx b/src/components/footer.tsx index 4b19b2f..6874e34 100644 --- a/src/components/footer.tsx +++ b/src/components/footer.tsx @@ -18,6 +18,7 @@ export default function Footer() {

    Zen Browser

    Follow Us

     @@ -72,6 +73,7 @@ export default function Footer() {
    )} @@ -548,12 +552,20 @@ export default function Features() { cause.