feat: add cv

bbtgnn · Mar 1, 2024 · 1cc862b · 1cc862b
1 parent 59416eb
commit 1cc862b
Show file tree

Hide file tree

Showing 5 changed files with 112 additions and 30 deletions.
diff --git a/README.md b/README.md
@@ -45,6 +45,11 @@ string[] or string field
 
 make `Page` component that uses the $page store to get the current collection document
 
+--
+
+check todo
+important transform function for fields
+
 ---
 
 - "inline" properties like:

diff --git a/src/_modules/fields.ts b/src/_modules/fields.ts
@@ -23,6 +23,13 @@ type DateFormats = 'yyyy-MM' | 'yyyy-MM-dd';
 export const DateString = (dateFormat: DateFormats) =>
 	T.Transform(T.String()).Decode(stringToDate).Encode(dateToString(dateFormat));
 
+// TODO - Aggiungere funzioni come kirby
+// export const Date = (format: DateFormats) =>
+// 	T.Transform(T.String()).Decode((date_string) => ({
+// 		format: () => formatDate(date_string, format),
+// 		_raw: date_string
+// 	})).Encode(dateToString(format));
+
 // export const DateSpan = (dateFormat: DateFormats = 'yyyy-MM-dd') =>
 // 	T.Object({
 // 		date_start: DateString(dateFormat),

diff --git a/src/app.pcss b/src/app.pcss
@@ -6,3 +6,7 @@
 .link {
 	@apply cursor-pointer text-blue-600 underline hover:text-blue-400;
 }
+
+.button {
+	@apply inline-block rounded-xl bg-blue-500 p-4 text-white;
+}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
@@ -2,44 +2,49 @@
 	import { Collection, Document, Relation } from '$modules/components';
 	import DocumentContent from '$modules/components/DocumentContent.svelte';
 	import { db } from '$modules/index';
+	import { href } from '$modules/utils';
 
 	const links = db.get_paths();
 </script>
 
-<div class="space-y-2 p-4">
-	{#each links as link}
-		<a class="link block" href={link}>{link}</a>
-	{/each}
-</div>
+<div class="flex">
+	<div class="space-y-2 p-4">
+		{#each links as link}
+			<a class="link block" href={link}>{link}</a>
+		{/each}
+	</div>
 
-<a href="/cv" class="rounded-xl bg-blue-500 p-4 text-white">CV</a>
+	<div>
+		<a href={href('/cv')} class="button">CV</a>
 
-<Document collection="organizations" name="dyne" let:doc>
-	<pre>{JSON.stringify(doc)}</pre>
-	<img alt="ciao" src={doc.props?.logo} />
-</Document>
+		<Document collection="organizations" name="dyne" let:doc>
+			<pre>{JSON.stringify(doc)}</pre>
+			<img alt="ciao" src={doc.props?.logo} />
+		</Document>
 
-<hr />
+		<hr />
 
-<Collection
-	name="work_experiences"
-	sort={[
-		['current', 'asc'],
-		['date_start', 'desc']
-	]}
-	let:documents
->
-	<div class="flex gap-2">
-		{#each documents as experience}
-			<div class="rounded-lg border border-gray-300 p-4">
-				<!-- TODO: Componente come superdebug di superforms per testare i json, visibile solo in dev -->
-				<pre>{JSON.stringify(experience, null, 2)}</pre>
+		<Collection
+			name="work_experiences"
+			sort={[
+				['current', 'asc'],
+				['date_start', 'desc']
+			]}
+			let:documents
+		>
+			<div class="flex gap-2">
+				{#each documents as experience}
+					<div class="rounded-lg border border-gray-300 p-4">
+						<!-- TODO: Componente come superdebug di superforms per testare i json, visibile solo in dev -->
+						<pre>{JSON.stringify(experience, null, 2)}</pre>
 
-				<Relation to={experience.props?.employer} let:doc>
-					<pre>{JSON.stringify(doc, null, 2)}</pre>
-					<DocumentContent />
-				</Relation>
+						<Relation to={experience.props?.employer} let:doc>
+							<pre>{JSON.stringify(doc, null, 2)}</pre>
+							<DocumentContent />
+						</Relation>
+					</div>
+				{/each}
 			</div>
-		{/each}
+		</Collection>
 	</div>
-</Collection>
+</div>
diff --git a/src/routes/cv/+page.svelte b/src/routes/cv/+page.svelte
@@ -0,0 +1,61 @@
+<script lang="ts">
+	import Collection from '$modules/components/Collection.svelte';
+	import Document from '$modules/components/Document.svelte';
+	import Relation from '$modules/components/Relation.svelte';
+	import { href } from '$modules/utils';
+	import { formatDate } from 'date-fns/format';
+</script>
+
+<a href={href('/')} class="button">Home</a>
+
+<Collection name="work_experiences" sort={['date_start', 'desc']} let:documents>
+	<div class="flex flex-col">
+		<h1>Esperienze lavorative attuali</h1>
+		{#each documents as document}
+			{#if document.props?.current}
+				<div class="rounded-xl border border-stone-300 p-4">
+					<p>{document.props.roles.join(', ')}</p>
+					<Document
+						collection={document.props.employer.collection}
+						name={document.props.employer.document}
+						let:doc
+					>
+						<p>{doc.props?.name}</p>
+					</Document>
+					<p>
+						<span>
+							{formatDate(document.props.date_start, 'MM / yyyy')}
+						</span>
+						<span>-></span>
+						<span> oggi </span>
+					</p>
+				</div>
+				<!-- <pre>{JSON.stringify(document, null, 2)}</pre> -->
+			{/if}
+		{/each}
+
+		<h1>Esperienze lavorative passate</h1>
+		{#each documents as document}
+			{#if document.props?.date_end}
+				<div class="rounded-xl border border-stone-300 p-4">
+					<p>{document.props.roles.join(', ')}</p>
+					<Document
+						collection={document.props.employer.collection}
+						name={document.props.employer.document}
+						let:doc
+					>
+						<p>{doc.props?.name}</p>
+					</Document>
+					<p>
+						<span>
+							{formatDate(document.props.date_start, 'MM / yyyy')}
+						</span>
+						<span>-></span>
+						<span> oggi </span>
+					</p>
+				</div>
+				<!-- <pre>{JSON.stringify(document, null, 2)}</pre> -->
+			{/if}
+		{/each}
+	</div>
+</Collection>