gitbutlerapp/gitbutler
1
1
Fork 0
mirror of https://github.com/gitbutlerapp/gitbutler.git synced 2024-12-01 04:14:45 +03:00
Code Issues Packages Projects Releases Wiki Activity

Update +page.svelte

Browse Source
This commit is contained in:
Ian Donahue 2023-03-10 17:17:43 +01:00
parent 1d978282cf
commit 1d3deba8cb
1 changed files with 59 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

94
src/routes/projects/[projectId]/+page.svelte
View File

@ -81,49 +81,73 @@
}
</script>
<div class="mt-4 px-8 flex flex-col">
<h1 class="flex text-xl text-zinc-200">
{$project?.title} <span class="text-zinc-600 ml-2">Project</span>
</h1>
<div class="grid grid-cols-3 mt-4">
<div class="col-span-2 pr-6">
<h2 class="text-lg font-bold text-zinc-500 mb-4">Recent File Changes</h2>
{#if $dateSessions === undefined}
<span>Loading...</span>
{:else}
<div class="flex flex-col space-y-4">
{#each orderedSessions($dateSessions) as [dateMilliseconds, fileSessions]}
<div class="flex flex-col">
<div class="text-zinc-400 text-lg text-zinc-200 mb-1">
{new Date(parseInt(dateMilliseconds)).toLocaleDateString('en-us', {
weekday: 'long',
year: 'numeric',
month: 'short',
day: 'numeric'
})}
</div>
<div class="bg-zinc-700 rounded p-4">
{#each Object.entries(fileSessions) as filetime}
<div class="flex flex-row justify-between">
<div class="text-zinc-200 font-mono">{filetime[0]}</div>
<div class="text-zinc-400">{@html timestampsToSpark(filetime[1])}</div>
<div class="project-section-component">
<div class="flex">
<div class="main-column-containercol-span-2 pr-6 mt-4 px-8" style="width: calc(100% * 0.66)">
<h1 class="flex text-xl text-zinc-200">
{$project?.title} <span class="ml-2 text-zinc-600">Project</span>
</h1>
<div class="mt-4">
<div class="recent-file-changes-container w-full">
<h2 class="mb-4 text-lg font-bold text-zinc-300">Recent File Changes</h2>
{#if $dateSessions === undefined}
<span>Loading...</span>
{:else}
<div class="flex flex-col space-y-4">
{#each orderedSessions($dateSessions) as [dateMilliseconds, fileSessions]}
<div class="flex flex-col">
<div class="mb-1 text-lg text-zinc-400 text-zinc-200">
{new Date(parseInt(dateMilliseconds)).toLocaleDateString('en-us', {
weekday: 'long',
year: 'numeric',
month: 'short',
day: 'numeric'
})}
</div>
{/each}
</div>
<div class="rounded bg-zinc-700 p-4">
{#each Object.entries(fileSessions) as filetime}
<div class="flex flex-row justify-between">
<div class="font-mono text-zinc-100">{filetime[0]}</div>
<div class="font-mono text-zinc-400">
{@html timestampsToSpark(filetime[1])}
</div>
</div>
{/each}
</div>
</div>
{/each}
</div>
{/each}
{/if}
</div>
{/if}
</div>
</div>
<div class="col-span-1 space-y-6">
<div class="secondary-column-container col-span-1 space-y-6 pt-4 px-4 border-l-zinc-700" style="width: 37%; height: calc(100vh - 110px); overflow-y: auto;">
<div>
<h2 class="text-lg font-bold text-zinc-500">Work in Progress</h2>
<div class="text-zinc-400 mt-4 mb-1 bg-zinc-700 rounded p-4">No uncommitted work</div>
</div>
<div>
<h2 class="text-lg font-bold text-zinc-500">Recent Activity</h2>
<div class="text-zinc-400 mt-4 mb-1 bg-zinc-700 rounded p-4">No recent activity</div>
<div class="">
<h2 class="text-lg font-bold text-zinc-300">Recent Activity</h2>
{#each recentActivity($dateSessions) as activity}
<div class="recent-activity-card mt-4 mb-1 text-zinc-400 border border-zinc-700 rounded">
<div class="flex flex-col">
<div class="flex flex-row justify-between rounded-t bg-[#2F2F33] p-2">
<div class="text-zinc-300">
{new Date(parseInt(activity.timestampMs)).toLocaleDateString('en-us', {
weekday: 'long',
year: 'numeric',
month: 'short',
day: 'numeric'
})}
</div>
<div class="font-mono text-right">{activity.type}</div>
</div>
<div class="rounded-b bg-[#2F2F33] p-2">{activity.message}</div>
</div>
</div>
{/each}
</div>
</div>
</div>