Skip to content
This repository has been archived by the owner on Dec 24, 2024. It is now read-only.

Commit

Permalink
remove remappings
Browse files Browse the repository at this point in the history
  • Loading branch information
perryd01 committed Mar 10, 2023
1 parent 16d8b95 commit 82d2015
Show file tree
Hide file tree
Showing 14 changed files with 119 additions and 300 deletions.
27 changes: 5 additions & 22 deletions src/components/organizer/OrganizerCard.tsx
Original file line number Diff line number Diff line change
@@ -1,38 +1,21 @@
import type { Asset } from "contentful";
import Image from "next/image";
import { useTranslation } from "next-i18next";

import type {
LocalizedEntry,
LocalizedFields,
TypeOrganizerFields,
} from "@/@types/generated";
import type { TypeOrganizerFields } from "@/@types/generated";

type OrganizerCardProps = {
organizer: LocalizedFields<TypeOrganizerFields, "hu" | "en">;
organizer: TypeOrganizerFields;
};

export function OrganizerCard({ organizer }: OrganizerCardProps) {
const { i18n } = useTranslation("common");

const localized = Object.fromEntries(
Object.entries(organizer).map(([key, value]) => [
key,
value[i18n.language as "en" | "hu"] ?? value.hu,
]),
) as unknown as Omit<TypeOrganizerFields, "image"> & {
image: LocalizedEntry<Asset, "en" | "hu">;
};

const { name, title, email, image } = localized;
const { name, title, email, image } = organizer;

return (
<div className="w-full min-w-[320px] overflow-hidden rounded-lg bg-white/10 backdrop-blur">
<div className="relative mx-auto aspect-1 bg-gradient-to-b from-konf-primary-green to-transparent">
<Image
src={
image.fields.file?.hu?.url
? `https:${image.fields.file.hu.url}`
image.fields.file?.url
? `https:${image.fields.file.url}`
: "http://placekitten.com/350/200"
}
fill
Expand Down
49 changes: 9 additions & 40 deletions src/components/presentations/PresentationCard.tsx
Original file line number Diff line number Diff line change
@@ -1,60 +1,29 @@
import clsx from "clsx";
import type { Asset } from "contentful";
import Image from "next/image";
import Link from "next/link";
import { useTranslation } from "next-i18next";
import type { MDXRemoteSerializeResult } from "next-mdx-remote";
import { MDXRemote } from "next-mdx-remote";

import type {
LocalizedEntry,
LocalizedTypePresentationFields,
TypePresentationFields,
} from "@/@types/generated";
import type { TypePresentationFields } from "@/@types/generated";

import { components } from "../mdx/MDXComponents";
import styles from "./PresentationCard.module.scss";

/*
function sliceString(str: string, length: number) {
if (str.length > length) {
const slicedString = str.slice(0, 200);
const nearestWhiteSpace = slicedString.lastIndexOf(" ");
return `${slicedString.slice(0, nearestWhiteSpace)}...`;
}
return str.slice(0, length);
}
*/

export type PresentationCardProps = {
presentation: LocalizedTypePresentationFields<"en" | "hu">;
mdxSource: {
en: MDXRemoteSerializeResult<{ [key: string]: unknown }>;
hu: MDXRemoteSerializeResult<{ [key: string]: unknown }>;
};
presentation: TypePresentationFields;
mdxSource: MDXRemoteSerializeResult<{ [key: string]: unknown }>;
};

export function PresentationCard({
presentation,
mdxSource,
}: PresentationCardProps) {
const { t, i18n } = useTranslation("common");

const localized = Object.fromEntries(
Object.entries(presentation).map(([key, value]) => [
key,
value[i18n.language as "en" | "hu"] ?? value.hu,
]),
) as unknown as Omit<TypePresentationFields, "image"> & {
image: LocalizedEntry<Asset, "en" | "hu">;
};
const { t } = useTranslation("common");

const { title, name, slug, image } = localized;
const localizedMdxSource = mdxSource[i18n.language as "en" | "hu"];
const { title, name, slug, image } = presentation;

// const slicedDescription = sliceString(description, 200);
const href =
i18n.language === "hu" ? `/eloadasok/${slug}` : `/en/presentations/${slug}`;
const href = `/eloadasok/${slug}`;

return (
<Link
Expand All @@ -64,8 +33,8 @@ export function PresentationCard({
<div className="relative mx-auto h-[300px] bg-gradient-to-b from-konf-primary-green to-transparent">
<Image
src={
image.fields.file?.hu?.url
? `https:${image.fields.file.hu.url}`
image.fields.file?.url
? `https:${image.fields.file.url}`
: "http://placekitten.com/350/200"
}
fill
Expand Down Expand Up @@ -96,7 +65,7 @@ export function PresentationCard({
styles.mdxContainer,
)}
>
<MDXRemote {...localizedMdxSource} components={components} />
<MDXRemote {...mdxSource} components={components} />
</div>
</div>
<div
Expand Down
14 changes: 3 additions & 11 deletions src/components/section/CharlesSection.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,9 @@
import clsx from "clsx";
import type { Asset } from "contentful";
import Image from "next/image";
import Link from "next/link";
import { FaArrowRight } from "react-icons/fa";

import type {
LocalizedEntry,
TypePresentationFields,
} from "@/@types/generated";
import type { TypePresentationFields } from "@/@types/generated";

export function SlugLink({ slug }: { slug: string }) {
return (
Expand All @@ -27,9 +23,7 @@ export function SlugLink({ slug }: { slug: string }) {
export function CharlesSection({
image,
slug,
}: Omit<TypePresentationFields, "image"> & {
image: LocalizedEntry<Asset, "en" | "hu">;
}) {
}: Pick<TypePresentationFields, "slug" | "image">) {
return (
<section id="charles" className="container mx-auto px-4">
<div className="mx-auto flex w-full max-w-6xl flex-col items-center justify-between gap-8 rounded-2xl bg-white/10 px-8 py-10 backdrop-blur sm:flex-row">
Expand Down Expand Up @@ -70,9 +64,7 @@ export function CharlesSection({
>
<div className="relative h-full w-full">
<Image
src={
image.fields.file ? `https:${image.fields.file.hu?.url}` : ""
}
src={image.fields.file ? `https:${image.fields.file.url}` : ""}
alt="Charles Simonyi"
fill
className={clsx("object-contain")}
Expand Down
90 changes: 25 additions & 65 deletions src/components/workshop/WorkshopCard.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,9 @@
import clsx from "clsx";
import { useTranslation } from "next-i18next";
import { MDXRemote, MDXRemoteSerializeResult } from "next-mdx-remote";

import type {
LocalizedTypeWorkshopFields,
LocalizedTypeWorkshopPersonFields,
LocalizedTypeWorkshopSlotFields,
TypeWorkshopSlotFields,
TypeWorkshopFields,
TypeWorkshopPersonFields,
} from "@/@types/generated";
import { EVENTBRITE_LINK } from "@/utils/constants";

Expand All @@ -15,17 +12,10 @@ import { components } from "../mdx/MDXComponents";
import { WorkshopCardBase } from "./WorkshopCardBase";
import { WorkshopCardSchdesignSection } from "./WorkshopCardSchdesignSection";
import { WorkshopPlace, WorkshopTimeRange } from "./WorkshopElements";
import type {
RemappedWorkshop,
RemappedWorkshopPresenter,
} from "./WorkshopTypes";

type WorkshopCardProps = {
workshop: LocalizedTypeWorkshopFields<"en" | "hu">;
mdxSource: {
en: MDXRemoteSerializeResult<{ [key: string]: unknown }>;
hu: MDXRemoteSerializeResult<{ [key: string]: unknown }>;
};
workshop: TypeWorkshopFields;
mdxSource: MDXRemoteSerializeResult<{ [key: string]: unknown }>;
};

const workshopRenderComponents = {
Expand Down Expand Up @@ -66,82 +56,52 @@ const workshopRenderComponents = {
};

export function WorkshopCard({ workshop, mdxSource }: WorkshopCardProps) {
const { i18n } = useTranslation("common");

const localized = Object.fromEntries(
Object.entries(workshop).map(([key, value]) => [
key,
value[i18n.language as "en" | "hu"] ?? value.hu,
]),
) as unknown as RemappedWorkshop;

const localizedMdxSource = mdxSource[i18n.language as "en" | "hu"];

const presenters =
localized.presenter?.map((p) => {
const fields = p.fields as LocalizedTypeWorkshopPersonFields<"hu" | "en">;
return Object.fromEntries(
Object.entries(fields).map(([key, value]) => [
key,
value[i18n.language as "en" | "hu"] ?? value.hu,
]),
) as unknown as RemappedWorkshopPresenter;
}) ?? [];

const eventSlots = localized.eventSlot.map((s) => {
const fields = s.fields as LocalizedTypeWorkshopSlotFields<"hu" | "en">;
return Object.fromEntries(
Object.entries(fields).map(([key, value]) => [
key,
value[i18n.language as "en" | "hu"] ?? value.hu,
]),
) as unknown as TypeWorkshopSlotFields;
});
const { title, variant, company, room, eventSlot, name, image, presenter } =
workshop;

const presenters: TypeWorkshopPersonFields[] =
presenter?.map((p) => p.fields) ?? [];
return (
<WorkshopCardBase
header={{
company: localized.company ?? "",
name: localized.name ?? "",
place: localized.room,
company: company ?? "",
name: name ?? "",
place: room,
time: {
start: new Date(eventSlots[0].startDate),
end: new Date(eventSlots[0].endDate),
start: new Date(eventSlot[0].fields.startDate),
end: new Date(eventSlot[0].fields.endDate),
},
variant: localized.variant,
variant,
}}
fullSizedImage={
localized.image?.fields.file?.hu?.url
image?.fields.file?.url
? {
src: `https:${localized.image.fields.file.hu.url}`,
alt: localized.company ?? "",
src: `https:${image.fields.file.url}`,
alt: company ?? "",
}
: undefined
}
>
<h2 className="mb-8 text-3xl font-bold sm:text-3xl lg:text-5xl">
{localized.title}
{title}
</h2>
<MDXRemote
{...localizedMdxSource}
components={workshopRenderComponents}
/>
{localized.variant === "schdesign" && (
<MDXRemote {...mdxSource} components={workshopRenderComponents} />
{variant === "schdesign" && (
<WorkshopCardSchdesignSection presenters={presenters} />
)}

{localized.variant === "ipar4.0" && (
{variant === "ipar4.0" && (
<>
<span className="my-2 block text-3xl font-medium">
Több időpontban is!
</span>
<div className="text-2xl">
{eventSlots.map((slot) => {
const start = new Date(slot.startDate);
const end = new Date(slot.endDate);
{eventSlot.map((slot) => {
const start = new Date(slot.fields.startDate);
const end = new Date(slot.fields.endDate);
return (
<li className="flex flex-row gap-2">
<WorkshopPlace place={slot.room} />
<WorkshopPlace place={slot.fields.room} />
<span className="select-none">|</span>
<WorkshopTimeRange start={start} end={end} />
</li>
Expand Down
9 changes: 4 additions & 5 deletions src/components/workshop/WorkshopCardSchdesignSection.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,9 @@ import clsx from "clsx";
import Image from "next/image";
import { FiExternalLink } from "react-icons/fi";

import type { TypeWorkshopPersonFields } from "@/@types/generated";

import { Highlighted } from "../highlight/Highlighted";
import type { RemappedWorkshopPresenter } from "./WorkshopTypes";

function LinkWrapper(
props: React.DetailedHTMLProps<
Expand Down Expand Up @@ -37,7 +38,7 @@ function LinkWrapper(
export function WorkshopCardSchdesignSection({
presenters,
}: {
presenters: RemappedWorkshopPresenter[];
presenters: TypeWorkshopPersonFields[];
}) {
return (
<div className="my-4">
Expand All @@ -59,9 +60,7 @@ export function WorkshopCardSchdesignSection({
<div className="relative aspect-1">
<Image
src={
p.image.fields.file?.hu
? `https:${p.image.fields.file.hu.url}`
: ""
p.image.fields.file ? `https:${p.image.fields.file.url}` : ""
}
fill
draggable={false}
Expand Down
17 changes: 1 addition & 16 deletions src/components/workshop/WorkshopTypes.ts
Original file line number Diff line number Diff line change
@@ -1,21 +1,6 @@
import type { Asset } from "contentful";

import type {
LocalizedEntry,
TypeWorkshopFields,
TypeWorkshopPersonFields,
} from "@/@types/generated";
import type { TypeWorkshopFields } from "@/@types/generated";

export type WorkshopVariantType = TypeWorkshopFields["variant"];
export type RemappedWorkshopPresenter = Omit<
TypeWorkshopPersonFields,
"image"
> & {
image: LocalizedEntry<Asset, "en" | "hu">;
};
export type RemappedWorkshop = Omit<TypeWorkshopFields, "image"> & {
image?: LocalizedEntry<Asset, "en" | "hu">;
};

export const localizedTimeOptions: Intl.DateTimeFormatOptions = {
hour: "2-digit",
Expand Down
Loading

0 comments on commit 82d2015

Please sign in to comment.