Add browse link on home page

zoriya · Oct 21, 2023 · 034f048 · 034f048
1 parent aceb6ee
commit 034f048
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 3 deletions.
diff --git a/front/packages/primitives/src/links.tsx b/front/packages/primitives/src/links.tsx
@@ -29,12 +29,12 @@ export const A = ({
 	replace,
 	children,
 	...props
-}: TextProps & { href: string; replace?: boolean; children: ReactNode }) => {
+}: TextProps & { href?: string; replace?: boolean; children: ReactNode }) => {
 	const { css, theme } = useYoshiki();
 
 	return (
 		<TextLink
-			href={href}
+			href={href ?? ""}
 			replace={replace as any}
 			experimental={
 				replace

diff --git a/front/packages/ui/src/navbar/index.tsx b/front/packages/ui/src/navbar/index.tsx
@@ -199,6 +199,7 @@ export const NavbarRight = () => {
 
 export const Navbar = (props: Stylable) => {
 	const { css, theme } = useYoshiki();
+	const { t } = useTranslation();
 
 	return (
 		<Header
@@ -223,7 +224,19 @@ export const Navbar = (props: Stylable) => {
 				props,
 			)}
 		>
-			<NavbarTitle {...css({ marginX: ts(2) })} />
+			<View {...css({ flexDirection: "row" })}>
+				<NavbarTitle {...css({ marginX: ts(2) })} />
+				<A
+					href="/browse"
+					{...css({
+						textTransform: "uppercase",
+						fontWeight: "bold",
+						color: (theme) => theme.contrast,
+					})}
+				>
+					{t("navbar.browse")}
+				</A>
+			</View>
 			<View
 				{...css({
 					flexGrow: 1,

diff --git a/front/translations/en.json b/front/translations/en.json
@@ -42,6 +42,7 @@
 	},
 	"navbar": {
 		"home": "Home",
+		"browse": "Browse",
 		"search": "Search",
 		"login": "Login"
 	},

diff --git a/front/translations/fr.json b/front/translations/fr.json
@@ -42,6 +42,7 @@
 	},
 	"navbar": {
 		"home": "Accueil",
+		"browse": "Liste",
 		"search": "Rechercher",
 		"login": "Connexion"
 	},