gitbutlerapp/gitbutler
1
1
Fork 0
mirror of https://github.com/gitbutlerapp/gitbutler.git synced 2024-11-24 05:29:51 +03:00
Code Issues Packages Projects Releases Wiki Activity

do not show dates without changes

Browse Source
This commit is contained in:
Nikita Galaiko 2023-03-28 16:22:04 +02:00
parent 20c03d6e96
commit b3e4ec151e
2 changed files with 67 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/lib/deltas.ts
View File

@ -23,32 +23,8 @@ export type DeltasEvent = {
filePath: string;
};
const cache: Record<string, Record<string, Promise<Record<string, Delta[]>>>> = {};
export const list = async (params: { projectId: string; sessionId: string; paths?: string[] }) => {
const sessionCache = cache[params.projectId] || {};
if (params.sessionId in sessionCache) {
return sessionCache[params.sessionId].then((deltas) =>
Object.fromEntries(
Object.entries(deltas).filter(([path]) =>
params.paths ? params.paths.includes(path) : true
)
)
);
}
const promise = invoke<Record<string, Delta[]>>('list_deltas', {
projectId: params.projectId,
sessionId: params.sessionId
});
sessionCache[params.sessionId] = promise;
cache[params.projectId] = sessionCache;
return promise.then((deltas) =>
Object.fromEntries(
Object.entries(deltas).filter(([path]) => (params.paths ? params.paths.includes(path) : true))
)
);
};
export const list = async (params: { projectId: string; sessionId: string; paths?: string[] }) =>
invoke<Record<string, Delta[]>>('list_deltas', params);
export const subscribe = (
params: { projectId: string; sessionId: string },

115
src/routes/projects/[projectId]/player/[date]/+layout.svelte
View File

@ -1,5 +1,7 @@
<script lang="ts">
import { page } from '$app/stores';
import { list as listDeltas } from '$lib/deltas';
import { asyncDerived } from '@square/svelte-store';
import { format } from 'date-fns';
import { derived } from 'svelte/store';
import type { LayoutData } from './$types';
@ -7,63 +9,76 @@
export let data: LayoutData;
const { sessions, projectId } = data;
const dates = derived(sessions, (sessions) =>
sessions
const fileFilter = derived(page, (page) => page.url.searchParams.get('file'));
const dates = asyncDerived([sessions, fileFilter], async ([sessions, fileFilter]) => {
const sessionFiles = await Promise.all(
sessions.map((session) =>
listDeltas({
projectId,
sessionId: session.id,
paths: fileFilter ? [fileFilter] : undefined
})
)
);
return sessions
.filter((_, index) => Object.keys(sessionFiles[index]).length > 0)
.map((session) => session.meta.startTimestampMs)
.sort((a, b) => b - a)
.map((ts) => format(new Date(ts), 'yyyy-MM-dd'))
.filter((date, index, self) => self.indexOf(date) === index)
);
.filter((date, index, self) => self.indexOf(date) === index);
});
const currentDate = derived(page, (page) => page.params.date);
const today = format(new Date(), 'yyyy-MM-dd');
const fileFilter = derived(page, (page) => page.url.searchParams.get('file'));
</script>
{#if $sessions.length === 0}
<div class="text-center">
<h2 class="text-xl">I haven't seen any changes yet</h2>
<p class="text-gray-500">Go code something!</p>
</div>
{:else}
{#if $fileFilter}
<a
href="/projects/{$page.params.projectId}/player/{$page.params.date}/{$page.params.sessionId}"
class="w-full p-2 text-left font-mono text-lg"
>
{$fileFilter}
</a>
{#await dates.load() then}
{#if $sessions.length === 0}
<div class="text-center">
<h2 class="text-xl">I haven't seen any changes yet</h2>
<p class="text-gray-500">Go code something!</p>
</div>
{:else}
{#if $fileFilter}
<a
href="/projects/{$page.params.projectId}/player/{$page.params.date}/{$page.params
.sessionId}"
class="w-full p-2 text-left font-mono text-lg"
>
{$fileFilter}
</a>
{/if}
<div class="flex h-full w-full flex-row gap-2 px-2">
<ul
id="days"
class="scrollbar-hidden grid h-full flex-shrink-0 auto-rows-min gap-2 overflow-y-scroll py-2"
>
{#each $dates as date}
{@const isToday = format(new Date(date), 'yyyy-MM-dd') === today}
<li>
<a
href="/projects/{projectId}/player/{date}{$page.url.search}"
class:bg-gb-800={date === $currentDate}
class:text-white={date === $currentDate}
class:border-gb-700={date !== $currentDate}
class:bg-gb-900={date !== $currentDate}
class="max-h-content flex w-full flex-col items-center justify-around rounded border border-[0.5px] p-2 text-zinc-300 shadow transition duration-150 ease-out hover:bg-gb-800 hover:ease-in"
>
{#if isToday}
<div class="py-2 text-lg leading-5">Today</div>
{:else}
<div class="text-xl leading-5">{new Date(date).getDate()}</div>
<div class="leading-4">{format(new Date(date), 'MMM')}</div>
{/if}
</a>
</li>
{/each}
</ul>
<slot />
</div>
{/if}
<div class="flex h-full w-full flex-row gap-2 px-2">
<ul
id="days"
class="scrollbar-hidden grid h-full flex-shrink-0 auto-rows-min gap-2 overflow-y-scroll py-2"
>
{#each $dates as date}
{@const isToday = format(new Date(date), 'yyyy-MM-dd') === today}
<li>
<a
href="/projects/{projectId}/player/{date}{$page.url.search}"
class:bg-gb-800={date === $currentDate}
class:text-white={date === $currentDate}
class:border-gb-700={date !== $currentDate}
class:bg-gb-900={date !== $currentDate}
class="max-h-content flex w-full flex-col items-center justify-around rounded border border-[0.5px] p-2 text-zinc-300 shadow transition duration-150 ease-out hover:bg-gb-800 hover:ease-in"
>
{#if isToday}
<div class="py-2 text-lg leading-5">Today</div>
{:else}
<div class="text-xl leading-5">{new Date(date).getDate()}</div>
<div class="leading-4">{format(new Date(date), 'MMM')}</div>
{/if}
</a>
</li>
{/each}
</ul>
<slot />
</div>
{/if}
{/await}