Skip to content

Commit 96c506b

Browse files
parloppapTh1nkK1DPoppap
authored
feat: add promise global events (#157)
* feat: retrieve global events data * feat: add global events in promise details page * refactor: remove type error * feat: show event links * style: add border dashed for global events --------- Co-authored-by: Th1nkK1D <[email protected]> Co-authored-by: Poppap <[email protected]>
1 parent 2fd5128 commit 96c506b

File tree

6 files changed

+58
-26
lines changed

6 files changed

+58
-26
lines changed

src/components/PromiseDetail/PromiseProgressTimeline.svelte

Lines changed: 31 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,15 @@
11
<script lang="ts">
22
import VoteCard from '$components/VoteCard/VoteCard.svelte';
33
import { formatThaiDate } from '$lib/date-parser';
4+
import type { GlobalEvent } from '$models/global-event';
45
import { PromiseStatus, type Promise } from '$models/promise';
56
import { Bullhorn, CheckmarkFilled } from 'carbon-icons-svelte';
67
import { twMerge } from 'tailwind-merge';
78
89
export let promise: Promise;
10+
export let globalEvents: GlobalEvent[];
911
10-
$: timeline = promise.progresses.sort((a, b) => {
12+
$: timeline = [...promise.progresses, ...globalEvents].sort((a, b) => {
1113
return b.date > a.date ? 1 : -1;
1214
});
1315
@@ -26,11 +28,12 @@
2628
};
2729
</script>
2830

29-
{#each timeline as progress, index}
31+
{#each timeline as event, index}
32+
{@const isProgress = 'type' in event}
3033
<div
3134
class={twMerge(
3235
'p-4 pb-0 text-text-01',
33-
progress.type === 'indirect' && 'text-gray-60',
36+
isProgress && event.type === 'indirect' && 'text-gray-60',
3437
index === 0 && promise.status === PromiseStatus.inProgress && 'bg-yellow-10',
3538
index === 0 && promise.status === PromiseStatus.fulfilled && 'bg-green-10',
3639
index === 0 && promise.status === PromiseStatus.unhonored && 'bg-magenta-10'
@@ -45,12 +48,12 @@
4548
class={twMerge(
4649
'absolute inset-0 mx-auto w-[1px] flex-1 border-l border-l-text-primary',
4750
index !== 0 && '-top-4',
48-
progress.type === 'indirect' && 'border-dashed',
51+
isProgress && event.type === 'indirect' && 'border-dashed border-l-gray-60',
4952
index === timeline.length - 1 && 'h-4',
50-
progress.type === 'indirect' && 'border-l-gray-60'
53+
!isProgress && 'border-dashed border-l-gray-60'
5154
)}
52-
></div>
53-
{#if progress.type === 'checkpoint'}
55+
/>
56+
{#if isProgress && event.type === 'checkpoint'}
5457
<CheckmarkFilled
5558
size={24}
5659
class={twMerge(
@@ -61,7 +64,7 @@
6164
)}
6265
/>
6366
{/if}
64-
{#if progress.type === 'indirect'}
67+
{#if !isProgress || event.type === 'indirect'}
6568
<Bullhorn
6669
size={24}
6770
class={twMerge(
@@ -75,35 +78,41 @@
7578
</div>
7679
<div class="flex flex-1 flex-col gap-6 md:flex-row">
7780
<div class="mb-4 flex flex-1 flex-col gap-2">
78-
<div class="body-01">{formatThaiDate(progress.date, true)}</div>
79-
<div class="heading-02">{progress.title}</div>
80-
{#if progress.description}
81-
<div class="body-01">{progress.description}</div>
81+
<div class={twMerge('body-01', !isProgress && 'text-text-02')}>
82+
{formatThaiDate(event.date, true)}
83+
</div>
84+
<div class={twMerge('heading-02', !isProgress && 'text-text-02')}>
85+
{event.title}
86+
</div>
87+
{#if event.description}
88+
<div class={twMerge('body-01', !isProgress && 'text-text-02')}>
89+
{event.description}
90+
</div>
8291
{/if}
83-
{#if progress.url}
92+
{#if event.url}
8493
<div class="label-01 text-gray-60">
8594
ที่มา: <a
86-
href={progress.url}
95+
href={event.url}
8796
target="_blank"
8897
rel="noopener noreferrer"
8998
class="label-01 break-all underline"
9099
>
91-
{progress.url}
100+
{event.url}
92101
</a>
93102
</div>
94103
{/if}
95104
</div>
96-
{#if progress.votingSummary}
105+
{#if isProgress && event.votingSummary}
97106
<VoteCard
98107
voting={{
99-
id: progress.votingSummary.id,
100-
nickname: progress.votingSummary.title || '',
101-
date: progress.votingSummary.date,
102-
result: progress.votingSummary.result
108+
id: event.votingSummary.id,
109+
nickname: event.votingSummary.title || '',
110+
date: event.votingSummary.date,
111+
result: event.votingSummary.result
103112
}}
104113
highlightedVoteByGroups={highlightedVoteByGroups(
105-
progress.votingSummary.resultsByAffiliation,
106-
progress.votingSummary.result
114+
event.votingSummary.resultsByAffiliation,
115+
event.votingSummary.result
107116
)}
108117
class="mb-4"
109118
/>
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import type { GlobalEvent } from '$models/global-event';
2+
import { sheets, withCache } from './shared';
3+
import { asDate, asString, Column, Object } from 'sheethuahua';
4+
5+
export const fetchGlobalEvents = withCache('Global Events', (): Promise<GlobalEvent[]> => {
6+
const partySchema = Object({
7+
title: Column('title', asString()),
8+
description: Column('description', asString()),
9+
date: Column('date', asDate()),
10+
url: Column('url', asString())
11+
});
12+
13+
return sheets.get('Global Events', partySchema);
14+
});

src/lib/datasheets/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { error } from '@sveltejs/kit';
33
export * from './fetchers/assembly';
44
export * from './fetchers/bill';
55
export * from './fetchers/bill-events';
6+
export * from './fetchers/global-events';
67
export * from './fetchers/party';
78
export * from './fetchers/politician';
89
export * from './fetchers/promise';

src/models/global-event.ts

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
export interface GlobalEvent {
2+
title: string;
3+
description: string;
4+
date: Date;
5+
url: string;
6+
}
Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1-
import { fetchFromIdOr404, fetchPromises } from '$lib/datasheets/index.js';
1+
import { fetchFromIdOr404, fetchGlobalEvents, fetchPromises } from '$lib/datasheets/index.js';
22

33
export async function load({ params }) {
44
const promise = await fetchFromIdOr404(fetchPromises, params.id);
5+
const globalEvents = await fetchGlobalEvents();
56

67
return {
7-
promise
8+
promise,
9+
globalEvents
810
};
911
}

src/routes/promises/[id]/+page.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
1212
export let data;
1313
14-
$: ({ promise } = data);
14+
$: ({ promise, globalEvents } = data);
1515
1616
let showStatusListModal = false;
1717
@@ -139,7 +139,7 @@
139139
คำสัญญามีสถานะอะไรบ้าง?
140140
</button>
141141
</div>
142-
<PromiseProgressTimeline {promise} />
142+
<PromiseProgressTimeline {promise} {globalEvents} />
143143
<div class="mt-8 flex flex-col justify-between gap-4 bg-gray-10 p-6 md:flex-row">
144144
<div class="text-01">
145145
<div class="heading-02">

0 commit comments

Comments
 (0)