redo resume

This commit is contained in:
Benjamin Palko 2025-06-18 13:21:28 -04:00
parent 6add8bb344
commit 342a0bffdb
3 changed files with 161 additions and 76 deletions

View file

@ -1,43 +0,0 @@
import { error } from '@sveltejs/kit';
import type { PageServerLoad } from './$types';
import { logger } from '$lib/server/logger';
export const load: PageServerLoad = async ({ locals }) => {
const { strapi } = locals;
try {
const { data: experiences, meta: experiencesMeta } = await strapi.Experiences();
const { data: education, meta: educationMeta } = await strapi.Education();
return {
experiences: experiences.map((item) => {
return {
title: item.Title,
company: item.Company,
description: item.Description,
startDate: item.StartDate,
endDate: item.EndDate,
logo: item.Logo
};
}),
education: education.map((item) => {
return {
institute: item.Institute,
field: item.Field,
description: item.Description,
startDate: item.StartDate,
endDate: item.EndDate
};
}),
meta: {
experiences: experiencesMeta,
education: educationMeta
}
};
} catch (err) {
logger.error('Uh-oh!', err);
if (err instanceof Error) {
error(500, err);
}
}
};

View file

@ -1,33 +1,49 @@
<script lang="ts">
import dayjs from 'dayjs';
import type { PageProps } from './$types';
import { Briefcase, Heart, Zap } from '@lucide/svelte';
import resume from '$lib/constants/resume.json';
let { data }: PageProps = $props();
type ExperienceItem = Exclude<typeof experiences, undefined>[number];
type EducationItem = Exclude<typeof education, undefined>[number];
type ExperienceItem = Exclude<typeof experiences, undefined>[number];
type SkillItem = Exclude<typeof skills, undefined>[number];
let experiences = $derived(
data.experiences?.sort((a, b) => {
if (dayjs(a.endDate).isBefore(b.startDate)) {
return 1;
}
return -1;
})
);
let education = $derived(
data.education?.sort((a, b) => {
resume.education?.sort((a, b) => {
if (dayjs(a.endDate).isBefore(b.startDate)) {
return 1;
}
return -1;
})
);
let experiences = $derived(
resume.work?.sort((a, b) => {
if (dayjs(a.endDate).isBefore(b.startDate)) {
return 1;
}
return -1;
})
);
let skills = $derived(resume.skills);
</script>
{#snippet EducationEntry(item: EducationItem)}
<div class="bg-base-100 rounded p-4">
<div class="flex items-center gap-2">
<div class="badge badge-outline badge-primary">
{dayjs(item.startDate).format('MMM YYYY')} - {item.endDate
? dayjs(item.endDate).format('MMM YYYY')
: 'Current'}
</div>
<p class="font-light text-gray-400">{item.location}</p>
</div>
<div class="flex flex-col gap-2 p-4">
<h3 class="text-lg font-semibold">{item.studyType}, {item.area}</h3>
<p>{item.institution}</p>
</div>
</div>
{/snippet}
{#snippet ExperienceEntry(item: ExperienceItem)}
<div class="bg-base-100 rounded">
<div class="bg-base-100 rounded p-4">
<div class="flex items-center gap-2">
<div class="badge badge-outline badge-primary">
{dayjs(item.startDate).format('MMM YYYY')} - {item.endDate
@ -37,30 +53,44 @@
<p class="font-light text-gray-400">{item.company}</p>
</div>
<div class="flex flex-col gap-2 p-4">
<h3 class="text-lg font-semibold">{item.title}</h3>
<h3 class="text-lg font-semibold">{item.position}</h3>
<p>{item.description}</p>
</div>
</div>
{/snippet}
{#snippet EducationEntry(item: EducationItem)}
<div class="bg-base-100 rounded">
{#snippet SkillEntry(skill: SkillItem)}
<div class="bg-base-100 rounded p-4">
<div class="flex items-center gap-2">
<div class="badge badge-outline badge-primary">
{dayjs(item.startDate).format('MMM YYYY')} - {item.endDate
? dayjs(item.endDate).format('MMM YYYY')
: 'Current'}
</div>
<p class="font-light text-gray-400">{item.institute}</p>
{skill.name}
</div>
<div class="flex flex-col gap-2 p-4">
<h3 class="text-lg font-semibold">{item.field}</h3>
<p>{item.description}</p>
<div class="flex flex-wrap gap-2 p-4">
{#each skill.keywords as keyword (keyword)}
<div class="badge badge-primary">{keyword}</div>
{/each}
</div>
</div>
{/snippet}
<div class="grid w-full gap-4 px-6 py-6 sm:px-8 sm:py-4 lg:grid-cols-2">
<!-- Education -->
<div class="col-span-full">
<div class="flex flex-col gap-1">
<h2 class="text-2xl font-light">Education</h2>
<div class="bg-base-100 h-0.5 w-48 rounded-full">
<div class="bg-primary h-0.5 w-1/3 rounded-full"></div>
</div>
</div>
</div>
{#if !education}
Looks like I have no education :(
{:else}
{#each education as item (item.location)}
{@render EducationEntry(item)}
{/each}
{/if}
<!-- Experience -->
<div class="col-span-full">
<div class="flex flex-col gap-1">
@ -79,21 +109,21 @@
{/each}
{/if}
<!-- Education -->
<!-- Skills -->
<div class="col-span-full">
<div class="flex flex-col gap-1">
<h2 class="text-2xl font-light">Education</h2>
<h2 class="text-2xl font-light">Skills</h2>
<div class="bg-base-100 h-0.5 w-48 rounded-full">
<div class="bg-primary h-0.5 w-1/3 rounded-full"></div>
</div>
</div>
</div>
{#if !education}
Looks like I have no education :(
{#if !experiences}
Looks like I have no skills :(
{:else}
{#each education as item (item.field)}
{@render EducationEntry(item)}
{#each skills as skill (skill.name)}
{@render SkillEntry(skill)}
{/each}
{/if}
</div>