Skip to content

Commit 8eb1e33

Browse files
sintaherenasintaherena
authored
Update language and Fix view more button (#27)
* update language and fix view more button * change logo amman * fix package-lock
1 parent 7ab47ed commit 8eb1e33

File tree

10 files changed

+56
-108
lines changed

10 files changed

+56
-108
lines changed

‎app/(main)/[lang]/home.tsx‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -28,15 +28,13 @@ import {
2828
mainProjectDesc,
2929
mainFaqHeading,
3030
mainFaqDesc,
31-
mainCtaLabel,
3231
mainViewMore,
3332
mainOpenInGoogleMaps,
3433
mainOurLocation
3534
} from "@/locales/.generated/server";
3635
import { getServices, getCaseStudies, getProject, getFaqs } from "./data";
3736

3837
const {
39-
cta,
4038
hero: { heading, subheading },
4139
location,
4240
socials,
@@ -78,8 +76,6 @@ export default function Home({ lang }: { lang: SupportedLanguage }) {
7876
}
7977

8078
function Services({ lang }: { lang: SupportedLanguage }) {
81-
const { gaEventName, link } = cta;
82-
8379
return (
8480
<GridItemsContainer id="services">
8581
<GridItemsTitle
@@ -92,7 +88,14 @@ function Services({ lang }: { lang: SupportedLanguage }) {
9288
cardClassName="rounded"
9389
lang={lang}
9490
/>
95-
<GridItemsMoreButton text="View More" href="/services" />
91+
<div className="mt-10 flex w-full items-center justify-center">
92+
<Button
93+
variant="default"
94+
className="bg-hyperjump-blue hover:bg-hyperjump-blue/90"
95+
asChild>
96+
<Link href="/services">{mainViewMore(lang)}</Link>
97+
</Button>
98+
</div>
9699
</GridItemsContainer>
97100
);
98101
}

‎app/(main)/[lang]/language-picker.tsx‎

Lines changed: 22 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,76 +1,38 @@
11
"use client";
22

3-
import { cn } from "@/lib/utils";
43
import {
54
SupportedLanguage,
65
supportedLanguages
76
} from "@/locales/.generated/types";
8-
import Link from "next/link";
7+
8+
const labelByLang: Record<SupportedLanguage, string> = {
9+
en: "🇬🇧 English",
10+
id: "🇮🇩 Indonesia"
11+
};
912

1013
export function LanguagePicker({
1114
lang,
12-
isOpen
15+
type = "hyperjump"
1316
}: {
1417
lang: SupportedLanguage;
15-
isOpen?: boolean;
18+
type?: "hyperjump" | "services";
1619
}) {
17-
return (
18-
<div className="flex gap-2">
19-
{supportedLanguages.map((l) => {
20-
const isActive = lang === l;
21-
22-
return (
23-
<Link
24-
scroll={false}
25-
key={l}
26-
href={`/${l}`}
27-
className={cn(
28-
"flex h-8 w-8 items-center justify-center rounded-md text-sm font-medium transition-colors",
29-
isActive
30-
? isOpen
31-
? "bg-hyperjump-blue"
32-
: "text-white group-data-[scroll='false']:bg-white group-data-[scroll='true']:bg-hyperjump-blue group-data-[scroll='false']:text-hyperjump-black group-data-[scroll='true']:text-white"
33-
: isOpen
34-
? "text-hyperjump-black"
35-
: "text-white group-data-[scroll='true']:text-hyperjump-black"
36-
)}>
37-
{l.toUpperCase()}
38-
</Link>
39-
);
40-
})}
41-
</div>
42-
);
43-
}
20+
const handleChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
21+
const newLang = e.target.value as SupportedLanguage;
22+
window.location.href =
23+
type === "hyperjump" ? `/${newLang}#hero` : `/services/${newLang}#hero`;
24+
};
4425

45-
export function LanguagePickerServices({
46-
lang,
47-
isOpen
48-
}: {
49-
lang: SupportedLanguage;
50-
isOpen?: boolean;
51-
}) {
5226
return (
53-
<div className="flex gap-2">
54-
{supportedLanguages.map((l) => {
55-
const isActive = lang === l;
56-
57-
return (
58-
<Link
59-
scroll={false}
60-
key={l}
61-
href={`/services/${l}`}
62-
className={cn(
63-
"flex h-8 w-8 items-center justify-center rounded-md text-sm font-medium transition-colors",
64-
isActive
65-
? "bg-hyperjump-blue text-white"
66-
: isOpen
67-
? "text-hyperjump-black"
68-
: "text-hyperjump-black group-data-[scroll='true']:text-hyperjump-black"
69-
)}>
70-
{l.toUpperCase()}
71-
</Link>
72-
);
73-
})}
74-
</div>
27+
<select
28+
value={lang}
29+
onChange={handleChange}
30+
className="max-w-32 rounded-full border border-[#2D364A] bg-transparent px-3 py-2 text-sm font-medium text-white">
31+
{supportedLanguages.map((l) => (
32+
<option key={l} value={l}>
33+
{labelByLang[l]}
34+
</option>
35+
))}
36+
</select>
7537
);
7638
}

‎app/(services)/services/[lang]/layout.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export default function ServicesLangLayout({
2020
/>
2121
<Hero lang={params.lang as SupportedLanguage} />
2222
{children}
23-
<Footer lang={params.lang as SupportedLanguage} />
23+
<Footer lang={params.lang as SupportedLanguage} type="services" />
2424
</div>
2525
);
2626
}

‎app/(services)/services/components/hero.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,9 @@ import {
88

99
export default function Hero({ lang }: { lang: SupportedLanguage }) {
1010
return (
11-
<section className="relative h-[415px] w-full bg-services-hero px-4 text-center text-hyperjump-black">
11+
<section
12+
id="hero"
13+
className="relative h-[415px] w-full bg-services-hero px-4 text-center text-hyperjump-black">
1214
<div className="mx-auto flex h-full max-w-3xl flex-col items-center justify-center pt-16">
1315
<h1 className="mb-4 text-2xl font-medium text-hyperjump-black sm:text-4xl md:text-[40px]">
1416
{servicesHeroHeading(lang)}

‎app/(services)/services/layout.tsx‎

Lines changed: 0 additions & 7 deletions
This file was deleted.

‎app/components/footer.tsx‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,15 @@ import { Separator } from "@/components/ui/separator";
33
import Image from "next/image";
44
import { SupportedLanguage } from "@/locales/.generated/types";
55
import { mainFooter } from "@/locales/.generated/server";
6+
import { LanguagePicker } from "../(main)/[lang]/language-picker";
67

7-
export default function Footer({ lang }: { lang: SupportedLanguage }) {
8+
export default function Footer({
9+
lang,
10+
type = "hyperjump"
11+
}: {
12+
lang: SupportedLanguage;
13+
type?: "hyperjump" | "services";
14+
}) {
815
return (
916
<footer className="relative overflow-hidden px-4 py-10 text-white md:px-20 md:py-14">
1017
<div className="absolute inset-0 z-0">
@@ -49,6 +56,7 @@ export default function Footer({ lang }: { lang: SupportedLanguage }) {
4956
</a>
5057
))}
5158
</div>
59+
<LanguagePicker lang={lang} type={type} />
5260

5361
<Separator className="w-full max-w-5xl bg-[#2D364A]" />
5462

‎app/components/hero.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,9 @@ import { mainHeroDesc, mainHeroHeading } from "@/locales/.generated/server";
66

77
export function Hero({ lang }: { lang: SupportedLanguage }) {
88
return (
9-
<section className="relative h-[648px] overflow-hidden bg-hyperjump-black px-4 text-white md:px-20">
9+
<section
10+
id="hero"
11+
className="relative h-[648px] overflow-hidden bg-hyperjump-black px-4 text-white md:px-20">
1012
<div className="absolute inset-0 z-0">
1113
<Image
1214
alt="Hero background"

‎app/components/nav.tsx‎

Lines changed: 4 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -23,21 +23,19 @@ import { Button } from "@/components/ui/button";
2323
import { SupportedLanguage } from "@/locales/.generated/types";
2424
import { mainNav } from "../(main)/[lang]/data";
2525
import { mainCtaLabel } from "@/locales/.generated/server";
26-
import {
27-
LanguagePicker,
28-
LanguagePickerServices
29-
} from "../(main)/[lang]/language-picker";
3026

3127
type NavProps = {
28+
type?: "hyperjump" | "services";
3229
className?: string;
3330
isTransparent?: boolean;
3431
lang: SupportedLanguage;
3532
};
3633

3734
export default function Nav({
3835
lang,
39-
className = "max-w-5xl",
40-
isTransparent = false
36+
isTransparent = false,
37+
type = "hyperjump",
38+
className = "max-w-5xl"
4139
}: NavProps) {
4240
const [isOpen, setIsOpen] = useState(false);
4341
const { gaEventName, link } = data.cta;
@@ -83,12 +81,6 @@ export default function Nav({
8381
</CenterNavItems>
8482

8583
<RightNavItems>
86-
{!isTransparent ? (
87-
<LanguagePickerServices isOpen={isOpen} lang={lang} />
88-
) : (
89-
<LanguagePicker isOpen={isOpen} lang={lang} />
90-
)}
91-
9284
<Button
9385
asChild
9486
variant={isTransparent ? "outline" : "default"}
@@ -112,12 +104,6 @@ export default function Nav({
112104

113105
{/* Mobile Toggle */}
114106
<div className="flex items-center lg:hidden">
115-
{!isTransparent ? (
116-
<LanguagePickerServices isOpen={isOpen} lang={lang} />
117-
) : (
118-
<LanguagePicker isOpen={isOpen} lang={lang} />
119-
)}
120-
121107
<button
122108
onClick={() => setIsOpen(!isOpen)}
123109
className="ml-2 p-0 lg:hidden"

0 commit comments

Comments
 (0)