ZenBrowserMirrors/www
1
0
Fork 0
mirror of https://github.com/zen-browser/www.git synced 2025-07-08 01:10:02 +02:00
Code Issues Projects Releases Packages Wiki Activity

chore(tsconfig): update paths to use ~ instead of @

Browse source
This commit is contained in:
Shintaro Jokagi 2025-05-12 23:43:11 +12:00
parent 37598bb645
commit 79f2381023
No known key found for this signature in database
GPG key ID: 0DDF8FA44C9A0DA8
27 changed files with 261 additions and 223 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/BackButton.astro
View file

@ -1,12 +1,12 @@
--- ---
import { ArrowLeft } from 'lucide-astro' import { ArrowLeft } from 'lucide-astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const { const {
routes: { routes: {
mods: {slug}, mods: { slug },
}, },
} = getUI(locale) } = getUI(locale)
--- ---

2
src/components/Button.astro
View file

@ -1,5 +1,5 @@
--- ---
import { getLocale, getPath } from '@/utils/i18n' import { getLocale, getPath } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const getLocalePath = getPath(locale) const getLocalePath = getPath(locale)

10
src/components/Community.astro
View file

@ -1,12 +1,12 @@
--- ---
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import { motion } from 'motion/react' import { motion } from 'motion/react'
import { Github, Check } from 'lucide-astro' import { Github, Check } from 'lucide-astro'
import { getTitleAnimation } from '@/animations' import { getTitleAnimation } from '~/animations'
import ComImage from '@/assets/ComImage.png' import ComImage from '~/assets/ComImage.png'
import Image from 'astro/components/Image.astro' import Image from 'astro/components/Image.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)

36
src/components/Features.astro
View file

@ -1,15 +1,15 @@
--- ---
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import { motion } from 'motion/react' import { motion } from 'motion/react'
import { getTitleAnimation } from '@/animations' import { getTitleAnimation } from '~/animations'
import WorkspacesVideo from '@/assets/Workspaces.webm' import WorkspacesVideo from '~/assets/Workspaces.webm'
import GlanceVideo from '@/assets/Glance.webm' import GlanceVideo from '~/assets/Glance.webm'
import CompactModeVideo from '@/assets/CompactMode.webm' import CompactModeVideo from '~/assets/CompactMode.webm'
import SplitViewsVideo from '@/assets/SplitViews.webm' import SplitViewsVideo from '~/assets/SplitViews.webm'
import Video from './Video.astro' import Video from './Video.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
@ -25,7 +25,9 @@ const {
title3 = features.title3, title3 = features.title3,
} = Astro.props } = Astro.props
const descriptions = Object.values(features.featureTabs).map((tab) => tab.description) const descriptions = Object.values(features.featureTabs).map(
(tab) => tab.description
)
--- ---
<section <section
@ -125,7 +127,11 @@ const descriptions = Object.values(features.featureTabs).map((tab) => tab.descri
</div> </div>
<!-- Mobile description --> <!-- Mobile description -->
<div class="feature-description mt-4 lg:hidden" data-descriptions={descriptions}></div> <div
class="feature-description mt-4 lg:hidden"
data-descriptions={descriptions}
>
</div>
</div> </div>
<div class="relative w-full lg:w-3/5"> <div class="relative w-full lg:w-3/5">
@ -173,10 +179,14 @@ const descriptions = Object.values(features.featureTabs).map((tab) => tab.descri
</section> </section>
<script> <script>
const features = document.querySelectorAll('.feature, .feature-tab') as NodeListOf<HTMLElement> const features = document.querySelectorAll(
'.feature, .feature-tab'
) as NodeListOf<HTMLElement>
// Set initial description // Set initial description
const descriptionEl = document.querySelector('.feature-description') as HTMLDivElement const descriptionEl = document.querySelector(
'.feature-description'
) as HTMLDivElement
const descriptions = descriptionEl?.dataset.descriptions?.split(',') const descriptions = descriptionEl?.dataset.descriptions?.split(',')
if (descriptionEl && descriptions) { if (descriptionEl && descriptions) {
descriptionEl.textContent = descriptions[0] descriptionEl.textContent = descriptions[0]
@ -209,7 +219,7 @@ const descriptions = Object.values(features.featureTabs).map((tab) => tab.descri
} }
const videos = document.querySelectorAll( const videos = document.querySelectorAll(
'.feature-video', '.feature-video'
) as NodeListOf<HTMLVideoElement> ) as NodeListOf<HTMLVideoElement>
videos.forEach((vid, i) => { videos.forEach((vid, i) => {
const yOffset = (i - index) * 20 const yOffset = (i - index) * 20

12
src/components/Footer.astro
View file

@ -1,11 +1,11 @@
--- ---
import Title from '@/components/Title.astro' import Title from '~/components/Title.astro'
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import Circles from '@/components/Circles.astro' import Circles from '~/components/Circles.astro'
import SocialMediaStrip from '@/components/SocialMediaStrip.astro' import SocialMediaStrip from '~/components/SocialMediaStrip.astro'
import { ArrowRight } from 'lucide-astro' import { ArrowRight } from 'lucide-astro'
import { getLocale, getPath, getUI } from '@/utils/i18n' import { getLocale, getPath, getUI } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const getLocalePath = getPath(locale) const getLocalePath = getPath(locale)

16
src/components/Hero.astro
View file

@ -1,14 +1,14 @@
--- ---
import Title from '@/components/Title.astro' import Title from '~/components/Title.astro'
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import HomePageVideo from '@/assets/HomePageVideo.webm' import HomePageVideo from '~/assets/HomePageVideo.webm'
import { ArrowRight } from 'lucide-astro' import { ArrowRight } from 'lucide-astro'
import { motion } from 'motion/react' import { motion } from 'motion/react'
import { getTitleAnimation } from '@/animations' import { getTitleAnimation } from '~/animations'
import Video from './Video.astro' import Video from './Video.astro'
import SocialMediaStrip from './SocialMediaStrip.astro' import SocialMediaStrip from './SocialMediaStrip.astro'
import { getLocale, getPath, getUI } from '@/utils/i18n' import { getLocale, getPath, getUI } from '~/utils/i18n'
let titleAnimationCounter = 0 let titleAnimationCounter = 0
function getNewAnimationDelay() { function getNewAnimationDelay() {
@ -69,13 +69,13 @@ const {
</motion.span> </motion.span>
<div class="mt-6 flex w-2/3 flex-col gap-3 sm:gap-6 md:w-fit md:flex-row"> <div class="mt-6 flex w-2/3 flex-col gap-3 sm:gap-6 md:w-fit md:flex-row">
<motion.span client:load {...getHeroTitleAnimation()}> <motion.span client:load {...getHeroTitleAnimation()}>
<Button class="w-full" href={getLocalePath("/download")} isPrimary> <Button class="w-full" href={getLocalePath('/download')} isPrimary>
{hero.buttons.beta} {hero.buttons.beta}
<ArrowRight class="size-4" /> <ArrowRight class="size-4" />
</Button> </Button>
</motion.span> </motion.span>
<motion.span client:load {...getHeroTitleAnimation()}> <motion.span client:load {...getHeroTitleAnimation()}>
<Button href={getLocalePath("/donate")}>{hero.buttons.support}</Button> <Button href={getLocalePath('/donate')}>{hero.buttons.support}</Button>
</motion.span> </motion.span>
</div> </div>
<motion.span <motion.span

2
src/components/MobileMenu.astro
View file

@ -1,5 +1,5 @@
--- ---
import { getLocale, getPath, getUI } from '@/utils/i18n' import { getLocale, getPath, getUI } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const getLocalePath = getPath(locale) const getLocalePath = getPath(locale)

50
src/components/ModsList.tsx
View file

@ -1,9 +1,9 @@
import { useState, useEffect } from 'preact/hooks' import { useState, useEffect } from 'preact/hooks'
import type { ZenTheme } from '@/mods' import type { ZenTheme } from '~/mods'
import { library, icon } from '@fortawesome/fontawesome-svg-core' import { library, icon } from '@fortawesome/fontawesome-svg-core'
import { faSort, faSortUp, faSortDown } from '@fortawesome/free-solid-svg-icons' import { faSort, faSortUp, faSortDown } from '@fortawesome/free-solid-svg-icons'
import { useModsSearch } from '@/hooks/useModsSearch' import { useModsSearch } from '~/hooks/useModsSearch'
import { getUI, type Locale } from '@/utils/i18n' import { getUI, type Locale } from '~/utils/i18n'
// Add icons to the library // Add icons to the library
library.add(faSort, faSortUp, faSortDown) library.add(faSort, faSortUp, faSortDown)
@ -80,7 +80,9 @@ export default function ModsList({ allMods, locale }: ModsListProps) {
window.scrollTo(0, 0) window.scrollTo(0, 0)
} }
const { routes: { mods } } = getUI(locale) const {
routes: { mods },
} = getUI(locale)
function renderPagination() { function renderPagination() {
if (totalPages <= 1) return null if (totalPages <= 1) return null
@ -98,26 +100,26 @@ export default function ModsList({ allMods, locale }: ModsListProps) {
&lt; &lt;
</button> </button>
<form onSubmit={handlePageSubmit} className="flex items-center gap-2"> <form onSubmit={handlePageSubmit} className="flex items-center gap-2">
{ {mods.pagination.pagination.split('{input}').map((value, index) => {
mods.pagination.pagination.split('{input}').map((value, index) => { if (index === 0) {
if (index === 0) {
return (
<input
type="text"
value={pageInput}
onInput={handlePageInputChange}
className="w-16 rounded border border-dark bg-transparent px-2 py-1 text-center text-sm"
aria-label="Page number"
/>
)
}
return ( return (
<span className="text-sm"> <input
{value.replace('{totalPages}', totalPages.toString()).replace('{totalItems}', totalItems.toString())} type="text"
</span> value={pageInput}
onInput={handlePageInputChange}
className="w-16 rounded border border-dark bg-transparent px-2 py-1 text-center text-sm"
aria-label="Page number"
/>
) )
}) }
} return (
<span className="text-sm">
{value
.replace('{totalPages}', totalPages.toString())
.replace('{totalItems}', totalItems.toString())}
</span>
)
})}
</form> </form>
<button <button
type="button" type="button"
@ -228,9 +230,7 @@ export default function ModsList({ allMods, locale }: ModsListProps) {
) : ( ) : (
<div className="col-span-4 grid place-items-center gap-4 place-self-center px-8 text-center"> <div className="col-span-4 grid place-items-center gap-4 place-self-center px-8 text-center">
<h2 className="text-lg font-bold">{mods.noResults}</h2> <h2 className="text-lg font-bold">{mods.noResults}</h2>
<p className="text-sm font-thin"> <p className="text-sm font-thin">{mods.noResultsDescription}</p>
{mods.noResultsDescription}
</p>
</div> </div>
)} )}
</div> </div>

4
src/components/NavBar.astro
View file

@ -1,13 +1,13 @@
--- ---
import { motion } from 'motion/react' import { motion } from 'motion/react'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import { Astronav, MenuItems, Dropdown, DropdownItems } from 'astro-navbar' import { Astronav, MenuItems, Dropdown, DropdownItems } from 'astro-navbar'
import { ArrowRight, ChevronDown, Download, Menu } from 'lucide-astro' import { ArrowRight, ChevronDown, Download, Menu } from 'lucide-astro'
import Logo from './Logo.astro' import Logo from './Logo.astro'
import { getTitleAnimation } from '../animations.ts' import { getTitleAnimation } from '../animations.ts'
import ThemeSwitch from './ThemeSwitch.astro' import ThemeSwitch from './ThemeSwitch.astro'
import MobileMenu from './MobileMenu.astro' import MobileMenu from './MobileMenu.astro'
import { getLocale, getPath, getUI } from '@/utils/i18n' import { getLocale, getPath, getUI } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const getLocalePath = getPath(locale) const getLocalePath = getPath(locale)

47
src/components/ReleaseNoteItem.astro
View file

@ -6,9 +6,9 @@ import {
type ReleaseNote, type ReleaseNote,
type BreakingChange, type BreakingChange,
getReleaseNoteFirefoxVersion, getReleaseNoteFirefoxVersion,
} from '../release-notes'; } from '../release-notes'
import { releaseNotes as releaseNotesData } from '../release-notes' import { releaseNotes as releaseNotesData } from '../release-notes'
import { getLocale, getUI, getPath } from '@/utils/i18n' import { getLocale, getUI, getPath } from '~/utils/i18n'
export type Props = ReleaseNote export type Props = ReleaseNote
const { isTwilight, ...props } = Astro.props const { isTwilight, ...props } = Astro.props
@ -17,9 +17,7 @@ const getLocalePath = getPath(locale)
const { const {
routes: { routes: {
releaseNotes: { releaseNotes: {
components: { components: { releaseNoteItem },
releaseNoteItem,
}
}, },
}, },
} = getUI(locale) } = getUI(locale)
@ -30,16 +28,16 @@ if (props.date) {
date = new Date(Date.parse(`${year}-${month}-${day}`)) date = new Date(Date.parse(`${year}-${month}-${day}`))
} }
const ffVersion = getReleaseNoteFirefoxVersion(props); const ffVersion = getReleaseNoteFirefoxVersion(props)
const currentReleaseIndex = releaseNotesData.findIndex( const currentReleaseIndex = releaseNotesData.findIndex(
(releaseNote: ReleaseNote) => releaseNote.version === props.version (releaseNote: ReleaseNote) => releaseNote.version === props.version
); )
const prevReleaseNote = releaseNotesData[currentReleaseIndex + 1]; const prevReleaseNote = releaseNotesData[currentReleaseIndex + 1]
let compareLink = ''; let compareLink = ''
if (prevReleaseNote && !isTwilight) { if (prevReleaseNote && !isTwilight) {
compareLink = `https://github.com/zen-browser/desktop/compare/${prevReleaseNote.version}...${props.version}`; compareLink = `https://github.com/zen-browser/desktop/compare/${prevReleaseNote.version}...${props.version}`
} }
--- ---
<section <section
class="release-note-item relative mt-24 flex flex-col border-t pt-24 lg:flex-row" class="release-note-item relative mt-24 flex flex-col border-t pt-24 lg:flex-row"
@ -50,7 +48,7 @@ if (prevReleaseNote && !isTwilight) {
isTwilight ? ( isTwilight ? (
<a <a
class="!mb-2 block w-fit rounded-full bg-coral px-3 py-1 text-xs text-paper" class="!mb-2 block w-fit rounded-full bg-coral px-3 py-1 text-xs text-paper"
href={getLocalePath("/download?twilight")} href={getLocalePath('/download?twilight')}
> >
{releaseNoteItem.twilight} {releaseNoteItem.twilight}
</a> </a>
@ -59,9 +57,13 @@ if (prevReleaseNote && !isTwilight) {
<h1 class="flex items-center text-3xl font-bold"> <h1 class="flex items-center text-3xl font-bold">
{ {
isTwilight ? ( isTwilight ? (
<>{releaseNoteItem.twilightChanges} {props.version} 🌙</> <>
{releaseNoteItem.twilightChanges} {props.version} 🌙
</>
) : ( ) : (
<>{releaseNoteItem.releaseChanges} {props.version} 🎉</> <>
{releaseNoteItem.releaseChanges} {props.version} 🎉
</>
) )
} }
{ {
@ -115,13 +117,7 @@ if (prevReleaseNote && !isTwilight) {
<div class="text-muted-forground mt-6 flex text-sm opacity-70"> <div class="text-muted-forground mt-6 flex text-sm opacity-70">
{isTwilight ? <Info class="mx-4 my-0 size-6 text-yellow-500" /> : null} {isTwilight ? <Info class="mx-4 my-0 size-6 text-yellow-500" /> : null}
<p class="m-0"> <p class="m-0">
{ {isTwilight ? <>{releaseNoteItem.twilightWarning}</> : null}
isTwilight ? (
<>
{releaseNoteItem.twilightWarning}
</>
) : null
}
<span set:html={releaseNoteItem.reportIssues} /> <span set:html={releaseNoteItem.reportIssues} />
</p> </p>
</div> </div>
@ -154,7 +150,10 @@ if (prevReleaseNote && !isTwilight) {
href={`https://github.com/zen-browser/desktop/issues/${fix.issue}`} href={`https://github.com/zen-browser/desktop/issues/${fix.issue}`}
rel="noopener noreferrer" rel="noopener noreferrer"
target="_blank" target="_blank"
aria-label={releaseNoteItem.viewIssue.replace('{issue}', fix.issue)} aria-label={releaseNoteItem.viewIssue.replace(
'{issue}',
fix.issue
)}
> >
#{fix.issue} #{fix.issue}
</a> </a>
@ -206,7 +205,9 @@ if (prevReleaseNote && !isTwilight) {
href={breakingChange.link} href={breakingChange.link}
rel="noopener noreferrer" rel="noopener noreferrer"
target="_blank" target="_blank"
aria-label={releaseNoteItem.sections.breakingChanges.description} aria-label={
releaseNoteItem.sections.breakingChanges.description
}
> >
{releaseNoteItem.learnMore} {releaseNoteItem.learnMore}
</a> </a>

14
src/components/Sponsors.astro
View file

@ -1,12 +1,12 @@
--- ---
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import { motion } from 'motion/react' import { motion } from 'motion/react'
import { getTitleAnimation } from '@/animations' import { getTitleAnimation } from '~/animations'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
import tutaLogo from '@/assets/tuta-logo.png' import tutaLogo from '~/assets/tuta-logo.png'
import Image from 'astro/components/Image.astro' import Image from 'astro/components/Image.astro'
const { showSponsors = true } = Astro.props const { showSponsors = true } = Astro.props
@ -31,7 +31,11 @@ const {
<div class="relative mt-8 flex items-center justify-center"> <div class="relative mt-8 flex items-center justify-center">
<motion.span client:load {...getTitleAnimation(0.6)}> <motion.span client:load {...getTitleAnimation(0.6)}>
<a href={sponsors.sponsors['tuta'].url} target="_blank" class="w-fit"> <a href={sponsors.sponsors['tuta'].url} target="_blank" class="w-fit">
<Image src={tutaLogo} alt={sponsors.sponsors['tuta'].name} class="h-16 w-fit object-contain" /> <Image
src={tutaLogo}
alt={sponsors.sponsors['tuta'].name}
class="h-16 w-fit object-contain"
/>
</a> </a>
</motion.span> </motion.span>
</div> </div>

6
src/layouts/Layout.astro
View file

@ -13,9 +13,9 @@ const defaultOgImage = '/share-pic.png';
import '@fontsource/bricolage-grotesque/400.css' import '@fontsource/bricolage-grotesque/400.css'
import '@fontsource/bricolage-grotesque/500.css' import '@fontsource/bricolage-grotesque/500.css'
import '@fontsource/bricolage-grotesque/600.css' import '@fontsource/bricolage-grotesque/600.css'
import NavBar from '@/components/NavBar.astro' import NavBar from '~/components/NavBar.astro'
import Footer from '@/components/Footer.astro' import Footer from '~/components/Footer.astro'
import { getLocale } from '@/utils/i18n' import { getLocale } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
--- ---

12
src/pages/[...locale]/404.astro
View file

@ -1,10 +1,10 @@
--- ---
import Title from '@/components/Title.astro' import Title from '~/components/Title.astro'
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import { getLocale, getPath, getUI } from '@/utils/i18n' import { getLocale, getPath, getUI } from '~/utils/i18n'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const getLocalePath = getPath(locale) const getLocalePath = getPath(locale)

10
src/pages/[...locale]/about.astro
View file

@ -1,9 +1,9 @@
--- ---
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)

20
src/pages/[...locale]/donate.astro
View file

@ -1,17 +1,15 @@
--- ---
import { ArrowRight } from 'lucide-astro' import { ArrowRight } from 'lucide-astro'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const { const {
routes: { routes: { donate },
donate, layout,
},
layout
} = getUI(locale) } = getUI(locale)
--- ---
@ -21,9 +19,7 @@ const {
class="relative flex w-full flex-col items-center justify-center gap-12" class="relative flex w-full flex-col items-center justify-center gap-12"
> >
<div class="px-8 lg:w-2/5 lg:text-center xl:px-0"> <div class="px-8 lg:w-2/5 lg:text-center xl:px-0">
<Description class="text-6xl font-bold" <Description class="text-6xl font-bold">{donate.title}</Description>
>{donate.title}</Description
>
<Description> <Description>
{donate.description} {donate.description}
</Description> </Description>

16
src/pages/[...locale]/download.astro
View file

@ -1,11 +1,11 @@
--- ---
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import { getReleasesWithChecksums } from '@/components/download/release-data.astro' import { getReleasesWithChecksums } from '~/components/download/release-data.astro'
import PlatformDownload from '@/components/download/PlatformDownload.astro' import PlatformDownload from '~/components/download/PlatformDownload.astro'
import DownloadScript from '@/components/download/DownloadScript.astro' import DownloadScript from '~/components/download/DownloadScript.astro'
import { getChecksums } from '@/utils/githubChecksums' import { getChecksums } from '~/utils/githubChecksums'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
import { library, icon } from '@fortawesome/fontawesome-svg-core' import { library, icon } from '@fortawesome/fontawesome-svg-core'
import { import {
@ -16,7 +16,7 @@ import {
} from '@fortawesome/free-brands-svg-icons' } from '@fortawesome/free-brands-svg-icons'
import { Lock, ExternalLink } from 'lucide-astro' import { Lock, ExternalLink } from 'lucide-astro'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const { const {

6
src/pages/[...locale]/feed.xml.ts
View file

@ -1,7 +1,7 @@
import rss, { type RSSOptions } from '@astrojs/rss' import rss, { type RSSOptions } from '@astrojs/rss'
import { releaseNotes } from '@/release-notes' import { releaseNotes } from '~/release-notes'
import type { ReleaseNote } from '@/release-notes' import type { ReleaseNote } from '~/release-notes'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
/** The default number of entries to include in the RSS feed. */ /** The default number of entries to include in the RSS feed. */
const RSS_ENTRY_LIMIT = 20 const RSS_ENTRY_LIMIT = 20

25
src/pages/[...locale]/index.astro
View file

@ -1,21 +1,22 @@
--- ---
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import Hero from '@/components/Hero.astro' import Hero from '~/components/Hero.astro'
import Community from '@/components/Community.astro' import Community from '~/components/Community.astro'
import Features from '@/components/Features.astro' import Features from '~/components/Features.astro'
import Sponsors from '@/components/Sponsors.astro' import Sponsors from '~/components/Sponsors.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const { const { layout } = getUI(locale)
layout,
} = getUI(locale)
--- ---
<Layout title={layout.index.title} description={layout.index.description} isHome> <Layout
title={layout.index.title}
description={layout.index.description}
isHome
>
<main> <main>
<Hero /> <Hero />
<Features /> <Features />

56
src/pages/[...locale]/mods/[...slug].astro
View file

@ -1,36 +1,36 @@
--- ---
import { getAllMods, getAuthorLink, getLocalizedDate } from '@/mods' import { getAllMods, getAuthorLink, getLocalizedDate } from '~/mods'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import BackButton from '@/components/BackButton.astro' import BackButton from '~/components/BackButton.astro'
import { ArrowRight, Info } from 'lucide-astro' import { ArrowRight, Info } from 'lucide-astro'
import { getUI } from '@/utils/i18n' import { getUI } from '~/utils/i18n'
import { getLocales, getLocale } from '@/utils/i18n' import { getLocales, getLocale } from '~/utils/i18n'
export async function getStaticPaths() { export async function getStaticPaths() {
const mods = await getAllMods() const mods = await getAllMods()
return mods.flatMap((mod) => [ return mods.flatMap((mod) => [
...getLocales().map((locale) => ({ ...getLocales().map((locale) => ({
params: { params: {
slug: mod.id, slug: mod.id,
locale: locale locale: locale,
}, },
props: { props: {
...mod, ...mod,
locale: locale locale: locale,
}, },
})), })),
{ {
params: { params: {
slug: mod.id, slug: mod.id,
locale: undefined locale: undefined,
}, },
props: { props: {
...mod, ...mod,
locale: undefined locale: undefined,
}, },
} },
]) ])
} }
@ -47,14 +47,14 @@ const locale = getLocale(Astro)
const { const {
routes: { routes: {
mods: {slug}, mods: { slug },
}, },
} = getUI(locale) } = getUI(locale)
--- ---
<Layout <Layout
title={slug.title.replace("{name}", mod.name)} title={slug.title.replace('{name}', mod.name)}
description={slug.description.replace("{name}", mod.name)} description={slug.description.replace('{name}', mod.name)}
ogImage={mod.image} ogImage={mod.image}
> >
<main class="mt-6 2xl:mt-0"> <main class="mt-6 2xl:mt-0">
@ -90,11 +90,23 @@ const {
/> />
<div class="flex flex-col justify-between gap-2 sm:flex-row"> <div class="flex flex-col justify-between gap-2 sm:flex-row">
<div class="flex flex-shrink-0 flex-col gap-2 font-normal"> <div class="flex flex-shrink-0 flex-col gap-2 font-normal">
<p set:html={slug.createdBy.replace("{author}", mod.author).replace("{version}", mod.version).replace("{link}", getAuthorLink(mod.author))} /> <p
<p set:html={slug.creationDate.replace("{createdAt}", dates.createdAt)} /> set:html={slug.createdBy
.replace('{author}', mod.author)
.replace('{version}', mod.version)
.replace('{link}', getAuthorLink(mod.author))}
/>
<p
set:html={slug.creationDate.replace('{createdAt}', dates.createdAt)}
/>
{ {
dates.createdAt !== dates.updatedAt && ( dates.createdAt !== dates.updatedAt && (
<p set:html={slug.latestUpdate.replace("{updatedAt}", dates.updatedAt)} /> <p
set:html={slug.latestUpdate.replace(
'{updatedAt}',
dates.updatedAt
)}
/>
) )
} }
{ {

14
src/pages/[...locale]/mods/index.astro
View file

@ -1,11 +1,11 @@
--- ---
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import ModsList from '@/components/ModsList' import ModsList from '~/components/ModsList'
import { getAllMods } from '@/mods' import { getAllMods } from '~/mods'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
import { CONSTANT } from '@/constants' import { CONSTANT } from '~/constants'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)

8
src/pages/[...locale]/privacy-policy.astro
View file

@ -1,8 +1,8 @@
--- ---
import Title from '@/components/Title.astro' import Title from '~/components/Title.astro'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)

6
src/pages/[...locale]/release-notes/[...slug].astro
View file

@ -1,7 +1,7 @@
--- ---
import { releaseNotes } from '@/release-notes' import { releaseNotes } from '~/release-notes'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import { getLocale, getUI, getStaticPaths as getI18nPaths } from '@/utils/i18n' import { getLocale, getUI, getStaticPaths as getI18nPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)

32
src/pages/[...locale]/release-notes/index.astro
View file

@ -1,20 +1,21 @@
--- ---
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import ReleaseNoteItem from '@/components/ReleaseNoteItem.astro' import ReleaseNoteItem from '~/components/ReleaseNoteItem.astro'
import { releaseNotes as releaseNotesData, releaseNotesTwilight } from '@/release-notes' import {
import Description from '@/components/Description.astro' releaseNotes as releaseNotesData,
import Button from '@/components/Button.astro' releaseNotesTwilight,
} from '~/release-notes'
import Description from '~/components/Description.astro'
import Button from '~/components/Button.astro'
import { Modal, ModalBody, ModalHeader } from 'free-astro-components' import { Modal, ModalBody, ModalHeader } from 'free-astro-components'
import { ArrowUp } from 'lucide-astro' import { ArrowUp } from 'lucide-astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const { const {
routes: { routes: { releaseNotes },
releaseNotes,
},
layout, layout,
} = getUI(locale) } = getUI(locale)
--- ---
@ -28,7 +29,13 @@ const {
class="py-42 flex min-h-screen flex-col justify-center px-10 lg:px-10 xl:px-10 2xl:w-3/5" class="py-42 flex min-h-screen flex-col justify-center px-10 lg:px-10 xl:px-10 2xl:w-3/5"
> >
<Description class="mt-48 text-4xl font-bold">Release Notes</Description> <Description class="mt-48 text-4xl font-bold">Release Notes</Description>
<p class="text-base opacity-55" set:html={releaseNotes.topSection.description.replaceAll("{latestVersion}", releaseNotesData[0].version)} /> <p
class="text-base opacity-55"
set:html={releaseNotes.topSection.description.replaceAll(
'{latestVersion}',
releaseNotesData[0].version
)}
/>
<div <div
class="mx-auto mt-8 flex w-fit flex-col gap-4 sm:mr-0 sm:flex-row sm:items-center" class="mx-auto mt-8 flex w-fit flex-col gap-4 sm:mr-0 sm:flex-row sm:items-center"
> >
@ -53,7 +60,8 @@ const {
</main> </main>
<Button href="#" id="scroll-top" isPrimary class="fixed bottom-8 right-8"> <Button href="#" id="scroll-top" isPrimary class="fixed bottom-8 right-8">
<p class="hidden items-center gap-2 sm:flex"> <p class="hidden items-center gap-2 sm:flex">
{releaseNotes.backToTop} <ArrowUp aria-hidden="true" class="size-4" /> {releaseNotes.backToTop}
<ArrowUp aria-hidden="true" class="size-4" />
</p> </p>
<ArrowUp aria-label="Back to the top" class="size-4 sm:hidden" /> <ArrowUp aria-label="Back to the top" class="size-4 sm:hidden" />
</Button> </Button>

18
src/pages/[...locale]/welcome.astro
View file

@ -1,15 +1,13 @@
--- ---
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import Features from '@/components/Features.astro' import Features from '~/components/Features.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const locale = getLocale(Astro) const locale = getLocale(Astro)
const { const {
routes: { routes: { welcome },
welcome,
},
layout, layout,
} = getUI(locale) } = getUI(locale)
--- ---
@ -18,6 +16,10 @@ const {
<main <main
class="relative mx-auto flex flex-col items-center gap-24 px-6 lg:gap-0 lg:px-24" class="relative mx-auto flex flex-col items-center gap-24 px-6 lg:gap-0 lg:px-24"
> >
<Features title1={welcome.title[0]} title2={welcome.title[1]} title3={welcome.title[2]} /> <Features
title1={welcome.title[0]}
title2={welcome.title[1]}
title3={welcome.title[2]}
/>
</main> </main>
</Layout> </Layout>

24
src/pages/[...locale]/whatsnew.astro
View file

@ -1,16 +1,16 @@
--- ---
import { ArrowRight } from 'lucide-astro' import { ArrowRight } from 'lucide-astro'
import Button from '@/components/Button.astro' import Button from '~/components/Button.astro'
import Description from '@/components/Description.astro' import Description from '~/components/Description.astro'
import SocialMediaStrip from '@/components/SocialMediaStrip.astro' import SocialMediaStrip from '~/components/SocialMediaStrip.astro'
import Layout from '@/layouts/Layout.astro' import Layout from '~/layouts/Layout.astro'
import { releaseNotes } from '@/release-notes' import { releaseNotes } from '~/release-notes'
import whatsNewText from '@/release-notes/whats-new.json' import whatsNewText from '~/release-notes/whats-new.json'
import Video from '@/components/Video.astro' import Video from '~/components/Video.astro'
import { getLocale, getUI } from '@/utils/i18n' import { getLocale, getUI } from '~/utils/i18n'
import whatsNewVideo from '@/assets/whats-new.mp4' import whatsNewVideo from '~/assets/whats-new.mp4'
export { getStaticPaths } from '@/utils/i18n' export { getStaticPaths } from '~/utils/i18n'
const latestVersion = releaseNotes[0] const latestVersion = releaseNotes[0]
@ -33,7 +33,7 @@ if (
<Layout <Layout
title={layout.whatsNew.title.replace( title={layout.whatsNew.title.replace(
'{latestVersion.version}', '{latestVersion.version}',
latestVersion.version, latestVersion.version
)} )}
> >
<main <main
@ -45,7 +45,7 @@ if (
>{ >{
whatsNew.title.replace( whatsNew.title.replace(
'{latestVersion.version}', '{latestVersion.version}',
latestVersion.version, latestVersion.version
) )
}</Description }</Description
> >

32
src/utils/i18n.ts
View file

@ -1,17 +1,15 @@
import type { AstroGlobal, GetStaticPaths } from 'astro' import type { AstroGlobal, GetStaticPaths } from 'astro'
import { CONSTANT } from '@/constants' import { CONSTANT } from '~/constants'
import UI_EN from '@/i18n/en.json' import UI_EN from '~/i18n/en.json'
export type Locale = (typeof locales)[number] export type Locale = (typeof locales)[number]
export const getPath = export const getPath = (locale?: Locale) => (path: string) => {
(locale?: Locale) => if (locale && !path.startsWith(`/${locale}`)) {
(path: string) => { return `/${locale}${path.startsWith('/') ? '' : '/'}${path}`
if (locale && !path.startsWith(`/${locale}`)) {
return `/${locale}${path.startsWith('/') ? '' : '/'}${path}`
}
return path
} }
return path
}
export const getLocale = (Astro: AstroGlobal) => { export const getLocale = (Astro: AstroGlobal) => {
if (Astro.params.locale) { if (Astro.params.locale) {
@ -37,12 +35,19 @@ export const getUI = (locale?: Locale | string): UI => {
const localeUI = ui[validLocale as Locale] const localeUI = ui[validLocale as Locale]
function deepMerge<T>(defaultObj: T, overrideObj: Partial<T>): T { function deepMerge<T>(defaultObj: T, overrideObj: Partial<T>): T {
if (typeof defaultObj !== 'object' || defaultObj === null) return (overrideObj ?? defaultObj) as T if (typeof defaultObj !== 'object' || defaultObj === null)
if (typeof overrideObj !== 'object' || overrideObj === null) return (overrideObj ?? defaultObj) as T return (overrideObj ?? defaultObj) as T
const result: any = Array.isArray(defaultObj) ? [...defaultObj] : { ...defaultObj } if (typeof overrideObj !== 'object' || overrideObj === null)
return (overrideObj ?? defaultObj) as T
const result: any = Array.isArray(defaultObj)
? [...defaultObj]
: { ...defaultObj }
for (const key in defaultObj) { for (const key in defaultObj) {
if (Object.prototype.hasOwnProperty.call(defaultObj, key)) { if (Object.prototype.hasOwnProperty.call(defaultObj, key)) {
result[key] = deepMerge((defaultObj as any)[key], (overrideObj as any)?.[key]) result[key] = deepMerge(
(defaultObj as any)[key],
(overrideObj as any)?.[key],
)
} }
} }
for (const key in overrideObj) { for (const key in overrideObj) {
@ -74,4 +79,3 @@ export const getStaticPaths = (() => {
export const getLocales = () => { export const getLocales = () => {
return [...locales, ...otherLocales] return [...locales, ...otherLocales]
} }

2
tsconfig.json
View file

@ -5,7 +5,7 @@
"jsxImportSource": "preact", "jsxImportSource": "preact",
"baseUrl": ".", "baseUrl": ".",
"paths": { "paths": {
"@/*": [ "~/*": [
"./src/*" "./src/*"
] ]
} }