From 987739e19741eb15371628b6358373c5bf81be1f Mon Sep 17 00:00:00 2001 From: Waled Khatiz Date: Wed, 28 Aug 2024 15:22:02 +1000 Subject: [PATCH 1/7] fix: README.md image src --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index ad4d64a..f1d00fc 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@

- +

From d6142c54de5a6bdf9b0ea02c3d35358bea68c3ff Mon Sep 17 00:00:00 2001 From: Waled Khatiz Date: Fri, 30 Aug 2024 11:28:55 +1000 Subject: [PATCH 2/7] fix: Responsive design on medium windows --- src/components/features.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/features.tsx b/src/components/features.tsx index dcfc642..160bc07 100644 --- a/src/components/features.tsx +++ b/src/components/features.tsx @@ -80,7 +80,7 @@ export default function Features() { return (
-
+

Your Browser, your way

With Zen's Theme Store, you can customize your browsing experience to reflect your unique style and preferences. Choose from a wide array of themes, colors, and layouts to make Zen truly your own, transforming your browser into a personalized digital space.

@@ -91,7 +91,7 @@ export default function Features() {
-
+

Community driven and Open Source

Zen thrives on the contributions of its vibrant community. As an open-source project, Zen encourages collaboration and innovation, allowing users and developers alike to shape the future of the browser.

@@ -144,7 +144,7 @@ export default function Features() {
Zen Browser
-
+
Zen Browser

Split Views

From c97d4344ab67dada71d224888f8d7cf5806d1c52 Mon Sep 17 00:00:00 2001 From: Waled Khatiz Date: Fri, 30 Aug 2024 11:48:12 +1000 Subject: [PATCH 3/7] fix: Disable flex warping on checkboxes --- src/components/features.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/features.tsx b/src/components/features.tsx index 160bc07..2cd7e13 100644 --- a/src/components/features.tsx +++ b/src/components/features.tsx @@ -53,7 +53,7 @@ import { getAllThemes, ZenTheme } from '@/lib/themes'; function Checkmark() { return ( - + ); } From b1aae853d08c1cb4e8a3725d5da8e774fc06957e Mon Sep 17 00:00:00 2001 From: Waled Khatiz Date: Fri, 30 Aug 2024 12:01:29 +1000 Subject: [PATCH 4/7] fix: Minor typos --- src/components/features.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/components/features.tsx b/src/components/features.tsx index dcfc642..6d4dbd1 100644 --- a/src/components/features.tsx +++ b/src/components/features.tsx @@ -109,11 +109,11 @@ export default function Features() {
-

Automated Releases, to prove security

+

Automated Releases to ensure security

-

Comunity driven

+

Community driven

@@ -173,18 +173,18 @@ export default function Features() {
-

Tab Groups (Comming Soon)

+

Tab Groups (Coming Soon)

-

Security And Privacy is important to us

+

Security and Privacy is important to us

Zen is based on Firefox, ensuring that your browsing experience prioritizes security and privacy. With advanced tracking protection and minimal data collection, Zen keeps your online activity safe and secure, giving you peace of mind as you explore the web.

- +
From 75a4eb64908bd38e1ef96889e590b57f9f35b421 Mon Sep 17 00:00:00 2001 From: Waled Khatiz Date: Fri, 30 Aug 2024 14:25:57 +1000 Subject: [PATCH 5/7] feat: Multi-language support --- messages/README-LANGUAGES.md | 18 ++++++++++++++++++ messages/de.json | 7 +++++++ messages/en.json | 7 +++++++ 3 files changed, 32 insertions(+) create mode 100644 messages/README-LANGUAGES.md create mode 100644 messages/de.json create mode 100644 messages/en.json diff --git a/messages/README-LANGUAGES.md b/messages/README-LANGUAGES.md new file mode 100644 index 0000000..ec15c0b --- /dev/null +++ b/messages/README-LANGUAGES.md @@ -0,0 +1,18 @@ +# Contributing Translations + +To contribute to the translation of your language you must modify the json in `/messages` that is named corresponding to the ISO Language Code of your given language. + +If you do not see a JSON for your language then add the language. + +## Adding a language + +1. To add a language you must add the language to the `const SUPPORTED_LANGUAGES = ['en', 'de'];` variable in the `./src/i18n.ts` file. +2. You must create a new `.json` file in the `./messages` directory +3. Copy the contents of the `en.json` file, make your way down the key-value pairs and change **only the values** to the translated equivalent. + + + + + + + diff --git a/messages/de.json b/messages/de.json new file mode 100644 index 0000000..a862be3 --- /dev/null +++ b/messages/de.json @@ -0,0 +1,7 @@ +{ + "navigation": { + "getting-started": "Erste Schritte", + "donate": "Spenden", + "useful-links": "Nützliche Links" + } +} \ No newline at end of file diff --git a/messages/en.json b/messages/en.json new file mode 100644 index 0000000..e0a7a18 --- /dev/null +++ b/messages/en.json @@ -0,0 +1,7 @@ +{ + "navigation": { + "getting-started": "Getting Started", + "donate": "Donate", + "useful-links": "Useful Links" + } +} \ No newline at end of file From a68ee89be2465d6d75e7e2c1b8a79396cb8560a6 Mon Sep 17 00:00:00 2001 From: Waled Khatiz Date: Fri, 30 Aug 2024 14:42:45 +1000 Subject: [PATCH 6/7] forgot-to-commit-the-rest --- next.config.js | 10 ++-- package-lock.json | 97 ++++++++++++++++++++++++++++++++++- package.json | 1 + src/app/layout.tsx | 28 ++++++---- src/components/navigation.tsx | 10 ++-- src/i18n.ts | 35 +++++++++++++ 6 files changed, 164 insertions(+), 17 deletions(-) create mode 100644 src/i18n.ts diff --git a/next.config.js b/next.config.js index 47cc272..7f48842 100644 --- a/next.config.js +++ b/next.config.js @@ -1,7 +1,10 @@ +const createNextIntlPlugin = require('next-intl/plugin'); const { PHASE_DEVELOPMENT_SERVER } = require('next/constants') - + +const withNextIntl = createNextIntlPlugin(); + /** @type {import('next').NextConfig} */ -module.exports = (phase, { defaultConfig }) => { +const nextConfig = (phase, { defaultConfig }) => { const defaultConfigWWW = { images: { remotePatterns: [ @@ -38,4 +41,5 @@ module.exports = (phase, { defaultConfig }) => { output: 'export', }; }; - + +module.exports = withNextIntl(nextConfig); diff --git a/package-lock.json b/package-lock.json index 00fa56f..3c0d111 100644 --- a/package-lock.json +++ b/package-lock.json @@ -31,6 +31,7 @@ "framer-motion": "^11.3.24", "lucide-react": "^0.400.0", "next": "14.2.4", + "next-intl": "^3.18.1", "next-themes": "^0.3.0", "react": "^18.3.1", "react-dom": "^18.3.1", @@ -2455,6 +2456,55 @@ "integrity": "sha512-X8R8Oj771YRl/w+c1HqAC1szL8zWQRwFvgDwT129k9ACdBoud/+/rX9V0qiMl6LWUdP9voC2nDVZYPMQQsb6eA==", "license": "MIT" }, + "node_modules/@formatjs/ecma402-abstract": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-2.0.0.tgz", + "integrity": "sha512-rRqXOqdFmk7RYvj4khklyqzcfQl9vEL/usogncBHRZfZBDOwMGuSRNFl02fu5KGHXdbinju+YXyuR+Nk8xlr/g==", + "license": "MIT", + "dependencies": { + "@formatjs/intl-localematcher": "0.5.4", + "tslib": "^2.4.0" + } + }, + "node_modules/@formatjs/fast-memoize": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/@formatjs/fast-memoize/-/fast-memoize-2.2.0.tgz", + "integrity": "sha512-hnk/nY8FyrL5YxwP9e4r9dqeM6cAbo8PeU9UjyXojZMNvVad2Z06FAVHyR3Ecw6fza+0GH7vdJgiKIVXTMbSBA==", + "license": "MIT", + "dependencies": { + "tslib": "^2.4.0" + } + }, + "node_modules/@formatjs/icu-messageformat-parser": { + "version": "2.7.8", + "resolved": "https://registry.npmjs.org/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.7.8.tgz", + "integrity": "sha512-nBZJYmhpcSX0WeJ5SDYUkZ42AgR3xiyhNCsQweFx3cz/ULJjym8bHAzWKvG5e2+1XO98dBYC0fWeeAECAVSwLA==", + "license": "MIT", + "dependencies": { + "@formatjs/ecma402-abstract": "2.0.0", + "@formatjs/icu-skeleton-parser": "1.8.2", + "tslib": "^2.4.0" + } + }, + "node_modules/@formatjs/icu-skeleton-parser": { + "version": "1.8.2", + "resolved": "https://registry.npmjs.org/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.8.2.tgz", + "integrity": "sha512-k4ERKgw7aKGWJZgTarIcNEmvyTVD9FYh0mTrrBMHZ1b8hUu6iOJ4SzsZlo3UNAvHYa+PnvntIwRPt1/vy4nA9Q==", + "license": "MIT", + "dependencies": { + "@formatjs/ecma402-abstract": "2.0.0", + "tslib": "^2.4.0" + } + }, + "node_modules/@formatjs/intl-localematcher": { + "version": "0.5.4", + "resolved": "https://registry.npmjs.org/@formatjs/intl-localematcher/-/intl-localematcher-0.5.4.tgz", + "integrity": "sha512-zTwEpWOzZ2CiKcB93BLngUX59hQkuZjT2+SAQEscSm52peDW/getsawMcWF1rGRpMCX6D7nSJA3CzJ8gn13N/g==", + "license": "MIT", + "dependencies": { + "tslib": "^2.4.0" + } + }, "node_modules/@hapi/hoek": { "version": "9.3.0", "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz", @@ -8604,6 +8654,18 @@ "node": ">= 0.4" } }, + "node_modules/intl-messageformat": { + "version": "10.5.14", + "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-10.5.14.tgz", + "integrity": "sha512-IjC6sI0X7YRjjyVH9aUgdftcmZK7WXdHeil4KwbjDnRWjnVitKpAx3rr6t6di1joFp5188VqKcobOPA6mCLG/w==", + "license": "BSD-3-Clause", + "dependencies": { + "@formatjs/ecma402-abstract": "2.0.0", + "@formatjs/fast-memoize": "2.2.0", + "@formatjs/icu-messageformat-parser": "2.7.8", + "tslib": "^2.4.0" + } + }, "node_modules/invariant": { "version": "2.2.4", "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", @@ -11328,7 +11390,6 @@ "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz", "integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==", "license": "MIT", - "peer": true, "engines": { "node": ">= 0.6" } @@ -11390,6 +11451,27 @@ } } }, + "node_modules/next-intl": { + "version": "3.18.1", + "resolved": "https://registry.npmjs.org/next-intl/-/next-intl-3.18.1.tgz", + "integrity": "sha512-ht8HyroJeiJIte9yhg1f0Nc2rlZmkvSYQ3nhqFVJLzhq7T1Xb8nfjilffrOJc3sA8kEjBOS4bdIrg4YX8REO0Q==", + "funding": [ + { + "type": "individual", + "url": "https://github.com/sponsors/amannn" + } + ], + "license": "MIT", + "dependencies": { + "@formatjs/intl-localematcher": "^0.5.4", + "negotiator": "^0.6.3", + "use-intl": "^3.18.1" + }, + "peerDependencies": { + "next": "^10.0.0 || ^11.0.0 || ^12.0.0 || ^13.0.0 || ^14.0.0", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/next-themes": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.3.0.tgz", @@ -15068,6 +15150,19 @@ } } }, + "node_modules/use-intl": { + "version": "3.18.1", + "resolved": "https://registry.npmjs.org/use-intl/-/use-intl-3.18.1.tgz", + "integrity": "sha512-BFNhVnszG1AB04DbNvJ+TLLd1oBDGergAKI8t9xaE4vDJYZaVKQH4zmpdArbegzTu5U9XMen6w14d1P1hBwKOQ==", + "license": "MIT", + "dependencies": { + "@formatjs/fast-memoize": "^2.2.0", + "intl-messageformat": "^10.5.14" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/use-sidecar": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/use-sidecar/-/use-sidecar-1.1.2.tgz", diff --git a/package.json b/package.json index fa53fd6..4709265 100644 --- a/package.json +++ b/package.json @@ -35,6 +35,7 @@ "framer-motion": "^11.3.24", "lucide-react": "^0.400.0", "next": "14.2.4", + "next-intl": "^3.18.1", "next-themes": "^0.3.0", "react": "^18.3.1", "react-dom": "^18.3.1", diff --git a/src/app/layout.tsx b/src/app/layout.tsx index fd2a59b..e68eabb 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -3,6 +3,8 @@ import { Inter } from "next/font/google"; import "./globals.css"; import { ThemeProvider } from "@/components/theme-provider"; import StyledComponentsRegistry from "@/lib/styled-components-registry"; +import {NextIntlClientProvider} from 'next-intl'; +import {getLocale, getMessages} from 'next-intl/server'; const inter = Inter({ subsets: ["latin"] }); @@ -12,26 +14,32 @@ export const metadata: Metadata = { keywords: ["Zen", "Browser", "Zen Browser", "Web", "Internet", "Fast"], }; -export default function RootLayout({ +export default async function RootLayout({ children, }: Readonly<{ children: React.ReactNode; }>) { + const locale = await getLocale(); + + const messages = await getMessages(); + return ( - + - - {children} - + + + {children} + + ); diff --git a/src/components/navigation.tsx b/src/components/navigation.tsx index 92ba5c1..e99420f 100644 --- a/src/components/navigation.tsx +++ b/src/components/navigation.tsx @@ -18,6 +18,7 @@ import { ModeToggle } from "./mode-toggle" import { MobileNav } from "./mobile-nav" import { HeartIcon } from "lucide-react" import { HeartFilledIcon } from "@radix-ui/react-icons" +import { useTranslations } from "next-intl"; export const components: { title: string; href: string; description: string }[] = [ { @@ -48,6 +49,9 @@ export const components: { title: string; href: string; description: string }[] ] export function Navigation() { + + const t = useTranslations('navigation'); + return (
@@ -59,7 +63,7 @@ export function Navigation() { - Getting started + {t('getting-started')}
  • @@ -94,7 +98,7 @@ export function Navigation() { - Donate + {t('donate')}
      @@ -114,7 +118,7 @@ export function Navigation() { - Useful Links + {t('useful-links')}
        {components.map((component) => ( diff --git a/src/i18n.ts b/src/i18n.ts new file mode 100644 index 0000000..a2fcfed --- /dev/null +++ b/src/i18n.ts @@ -0,0 +1,35 @@ +import { getRequestConfig } from "next-intl/server"; +import { headers } from "next/headers"; + +const SUPPORTED_LANGUAGES = ['en', 'de']; + +export default getRequestConfig(async () => { + const headersList = headers(); + + const acceptLanguage = headersList.get("accept-language") || "en"; + + const [primaryLanguage] = acceptLanguage + .split(",") + .map((lang) => lang.split(";")[0]) + .map((lang) => lang.toLowerCase()); + + const locale = SUPPORTED_LANGUAGES.includes(primaryLanguage) ? primaryLanguage : 'en'; + + try { + const messages = (await import(`../messages/${locale}.json`)).default; + + return { + locale, + messages, + }; + } catch (error) { + console.error(`Failed to load messages for locale: ${locale}`, error); + + const fallbackMessages = (await import(`../messages/en.json`)).default; + + return { + locale: "en", + messages: fallbackMessages, + }; + } +}); From d216713628b94a5c53ccd5ef76b5a32726d60ecc Mon Sep 17 00:00:00 2001 From: NOCanoa <158103554+NOCanoa@users.noreply.github.com> Date: Fri, 30 Aug 2024 12:17:55 +0100 Subject: [PATCH 7/7] Update features.tsx fix split screen aligment --- src/components/features.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/features.tsx b/src/components/features.tsx index dcfc642..83af1d7 100644 --- a/src/components/features.tsx +++ b/src/components/features.tsx @@ -144,7 +144,7 @@ export default function Features() {
Zen Browser
-
+
Zen Browser

Split Views