Ilgeldi
/
turkmen-expo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: some types and UI changes

This commit is contained in:
Atash03 2026-03-27 15:07:59 +05:00
parent cd3b3d3ad1
commit b612711883
5 changed files with 54 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/[locale]/(root)/calendar/[id]/page.tsx
View File

@ -62,12 +62,15 @@ export default async function EventPage({
)}
</div>
{data?.url_detailed || data?.url_registration || data?.url_web || data?.web_site ? (
<EventPageButtons
once={Boolean(data?.our)}
details={data?.url_detailed}
details={data?.url_detailed ? data?.url_detailed : data?.web_site}
register={data?.url_registration}
visit={data?.url_web}
visit={data?.url_web ? data?.url_web : data?.web_site}
/>
) : null}
</div>
<Image
@ -80,14 +83,14 @@ export default async function EventPage({
</div>
<div className="flex flex-col gap-8">
<div className="flex flex-col lg:flex-row gap-6">
{data?.description ?? <div className="flex flex-col lg:flex-row gap-6">
<h4 className="text_24 lg:flex-[0_0_392px]">
{t("description")}
</h4>
<p className="flex-1 text_16">{data?.description}</p>
</div>
<p className="flex-1 text_16">{data.description}</p>
</div>}
{data?.event_topic && (
{/* {data?.event_topic && (
<>
<hr className="border-OUTLINE_VAR" />
@ -101,7 +104,7 @@ export default async function EventPage({
/>
</div>
</>
)}
)} */}
</div>
</div>
);

2
app/[locale]/(root)/calendar/page.tsx
View File

@ -26,7 +26,7 @@ export default async function CalendarPage() {
</div>
<div className="flex flex-col gap-6 w-full">
{data.data.map((item, i) => (
<EventCard dark={true} key={i} {...item} />
<EventCard dark={true} key={i} {...item} starts_at={item.starts_at_text} ends_at={item.ends_at_text} />
))}
</div>
</div>

32
components/shared/event-card.tsx
View File

@ -16,8 +16,8 @@ import { Link } from "@/i18n/navigation";
interface Props {
id: number;
description: string;
starts_at: string;
ends_at: string;
starts_at: string | null;
ends_at: string | null;
date: string;
title: string;
web_site: string | null;
@ -44,13 +44,15 @@ export const EventCard = ({
images,
dark = false,
}: Props) => {
const formatDate = (dateString: string) => {
const dateParts = dateString?.split(" ");
const date = dateParts?.[0];
const parts = date?.split("-");
const formattedDate = `${parts?.[2]}.${parts?.[1]}.${parts?.[0]}`;
return formattedDate;
const formatDate = (dateString: string | null) => {
if (!dateString) return null;
const dateParts = dateString.split(" ");
const date = dateParts[0];
const parts = date.split("-");
if (parts.length === 3 && parts[0].length === 4) {
return `${parts[2]}.${parts[1]}.${parts[0]}`;
}
return dateString;
};
const t = useTranslations("events");
@ -80,8 +82,8 @@ export const EventCard = ({
{}
)}
>
<p className="mr-5">{formatDate(starts_at)}</p>{" "}
<p>{formatDate(ends_at)}</p>
{formatDate(starts_at) && <p className="mr-5">{formatDate(starts_at)}</p>}
{formatDate(ends_at) && <p>{formatDate(ends_at)}</p>}
</div>
</div>
@ -101,12 +103,13 @@ export const EventCard = ({
<div className="flex flex-col gap-[10px] md:gap-[15px]">
<h3
className={clsx(
"text-5 font-medium line leading-[115%] lg:leading-8 md:leading-[100%]"
"text-[18px] font-medium line leading-[115%] lg:leading-8 md:leading-[100%]"
)}
>
{title}
</h3>
</div>
{organizers && organizers?.length > 0 &&
<div className="flex flex-col gap-[10px]">
<p className="text-[#6B7674] uppercase font-normal leading-none text-[10px]">
{t("organiserLabel")}
@ -115,6 +118,7 @@ export const EventCard = ({
{organizers ? organizers[0]?.name : null}
</p>
</div>
}
{coorganizers && coorganizers?.length > 0 && (
<div className="flex flex-col gap-[10px]">
<p className="text-[#6B7674] uppercase font-normal leading-none text-[10px]">
@ -128,8 +132,8 @@ export const EventCard = ({
</div>
<div className="hidden md:flex text-2xl flex-col text-white leading- none h-[228px] min-w-[245px] items-center justify-center bg-[#31A898] px-12 text-center">
<p className="">{formatDate(starts_at)}</p>{" "}
<p>{formatDate(ends_at)}</p>
{formatDate(starts_at) && <p>{formatDate(starts_at)}</p>}
{formatDate(ends_at) && <p>{formatDate(ends_at)}</p>}
</div>
</div>
</div>

18
components/shared/event-page-buttons.tsx
View File

@ -1,7 +1,6 @@
"use client";
import { useTranslations } from "next-intl";
import { Link } from "@/i18n/navigation";
import { FC } from "react";
interface Props {
@ -12,6 +11,11 @@ interface Props {
details?: string;
}
function toExternalUrl(url: string) {
if (!/^https?:\/\//i.test(url)) return `https://${url}`;
return url;
}
export const EventPageButtons: FC<Props> = ({
once = false,
register,
@ -24,23 +28,23 @@ export const EventPageButtons: FC<Props> = ({
<div className="flex items-center gap-6">
{once ? (
<>
<Link href={register || ""} className="w-full" target="_blank">
<a href={toExternalUrl(register || "")} className="w-full" target="_blank" rel="noopener noreferrer">
<button className="full-btn bg-PRIMARY py-2.5 text-white">
{t("registration")}
</button>
</Link>
<Link href={visit || ""} className="w-full" target="_blank">
</a>
<a href={toExternalUrl(visit || "")} className="w-full" target="_blank" rel="noopener noreferrer">
<button className="full-btn bg-SECONDARY_CONTAINER py-2.5 text-ON_SECONDARY_CONTAINER">
{t("visitSite")}
</button>
</Link>
</a>
</>
) : (
<Link href={details || ""} className="w-full" target="_blank">
<a href={toExternalUrl(details || "")} className="w-full" target="_blank" rel="noopener noreferrer">
<button className="full-btn w-full bg-PRIMARY py-2.5 text-white">
{t("more")}
</button>
</Link>
</a>
)}
</div>
);

2
lib/types/Calendar.type.ts
View File

@ -22,6 +22,8 @@ export interface EventDatum {
installation_date: string;
dismantling_date: string;
event_topic: string;
starts_at_text: string | null
ends_at_text: string | null
}
export interface Coorganizers {