gitbutlerapp/gitbutler
1
1
Fork 0
mirror of https://github.com/gitbutlerapp/gitbutler.git synced 2024-11-28 04:47:42 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'master' of https://github.com/gitbutlerapp/gitbutler-client

Browse Source
This commit is contained in:
Ian Donahue 2023-03-13 13:19:45 +01:00
commit f95ce37c5c
11 changed files with 52 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/lib/components/CommandPalette.svelte
View File

@ -326,7 +326,7 @@
bind:this={palette}
in:fade={{ duration: 100 }}
out:fade={{ duration: 100 }}
class="mx-auto max-w-2xl transform divide-y divide-zinc-500 divide-opacity-20 overflow-hidden rounded-xl bg-zinc-900 shadow-2xl transition-all border border-zinc-700"
class="mx-auto max-w-2xl transform divide-y divide-zinc-500 divide-opacity-20 overflow-hidden rounded-xl border border-zinc-700 bg-zinc-900 shadow-2xl transition-all"
style="
height: auto;
max-height: 420px;
@ -368,7 +368,7 @@
<ul id="commandMenu" class="text-sm text-zinc-400">
{#each menuItems as item}
{#if item.type == 'divider'}
<li class="border-t border-zinc-500 border-opacity-20 my-2" />
<li class="my-2 border-t border-zinc-500 border-opacity-20" />
{:else}
<!-- Active: "bg-zinc-800 text-white" -->
<li
@ -403,7 +403,7 @@
in:fade={{ duration: 100 }}
out:fade={{ duration: 100 }}
bind:this={commitPalette}
class="mx-auto max-w-2xl transform overflow-hidden rounded-xl bg-zinc-900 shadow-2xl transition-all border border-zinc-700"
class="mx-auto max-w-2xl transform overflow-hidden rounded-xl border border-zinc-700 bg-zinc-900 shadow-2xl transition-all"
style="
border-width: 0.5px;
border: 0.5px solid rgba(63, 63, 70, 0.50);
@ -411,11 +411,11 @@
background-color: rgba(24, 24, 27, 0.6);
"
>
<div class="w-full border-b border-zinc-700 text-lg text-white mb-4 p-4">
<div class="mb-4 w-full border-b border-zinc-700 p-4 text-lg text-white">
Commit Your Changes
</div>
<div
class="relative transform overflow-hidden text-left transition-all sm:w-full sm:max-w-sm p-2 m-auto"
class="relative m-auto transform overflow-hidden p-2 text-left transition-all sm:w-full sm:max-w-sm"
>
{#if Object.entries(changedFiles).length > 0}
<div>
@ -431,7 +431,7 @@
id="commit-message"
bind:this={commitMessageInput}
bind:value={commitMessage}
class="block w-full rounded-md p-4 border-0 text-zinc-200 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:py-1.5 sm:text-sm sm:leading-6"
class="block w-full rounded-md border-0 p-4 text-zinc-200 ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-blue-600 sm:py-1.5 sm:text-sm sm:leading-6"
/>
</div>
</div>
@ -445,7 +445,7 @@
>Commit Your Changes</button
>
</div>
<div class="text-zinc-200 mt-4 py-4">
<div class="mt-4 py-4 text-zinc-200">
<h3 class="text-base font-semibold text-zinc-200" id="modal-title">
Changed Files
</h3>
@ -464,7 +464,7 @@
{/each}
</div>
{:else}
<div class="text-white mx-auto text-center">No changes to commit</div>
<div class="mx-auto text-center text-white">No changes to commit</div>
{/if}
</div>
</div>

2
src/lib/components/icons/ContactIcon.svelte
View File

@ -4,7 +4,7 @@
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-6 h-6"
class="h-6 w-6"
>
<path
stroke-linecap="round"

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 459 B

After

Width:  |  Height:  |  Size: 459 B

2
src/lib/components/icons/ProjectIcon.svelte
View File

@ -4,7 +4,7 @@
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
class="w-6 h-6"
class="h-6 w-6"
>
<path
stroke-linecap="round"

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 460 B

After

Width:  |  Height:  |  Size: 460 B

2
src/lib/components/search/RenderedSearchResult.svelte
View File

@ -12,7 +12,7 @@
<span class="flex-grow" />
<span>{formatDistanceToNow(processedResult.timestamp)} ago</span>
</p>
<div class="rounded-lg text-[#EBDBB2] bg-[#2F2F33] border border-zinc-700 drop-shadow-lg">
<div class="rounded-lg border border-zinc-700 bg-[#2F2F33] text-[#EBDBB2] drop-shadow-lg">
{#each processedResult.hunks as hunk, i}
{#if i > 0}
<div class="border-b border-[#52525B]" />

2
src/lib/current_project.ts
View File

@ -1,4 +1,4 @@
import { writable } from 'svelte/store';
import type { Project } from '$lib/projects';
export const currentProject = writable<Project|undefined>(undefined);
export const currentProject = writable<Project | undefined>(undefined);

22
src/lib/paths.ts
View File

@ -1,12 +1,12 @@
export function shortPath(path: string, max = 3) {
if (path.length < 30) {
return path;
}
const pathParts = path.split('/');
const file = pathParts.pop();
if (pathParts.length > 0) {
const pp = pathParts.map((p) => p.slice(0, max)).join('/');
return `${pp}/${file}`;
}
return file;
}
if (path.length < 30) {
return path;
}
const pathParts = path.split('/');
const file = pathParts.pop();
if (pathParts.length > 0) {
const pp = pathParts.map((p) => p.slice(0, max)).join('/');
return `${pp}/${file}`;
}
return file;
}

6
src/routes/+page.svelte
View File

@ -188,17 +188,17 @@
</div>
</div>
<div
class="flex-grow-0 rounded-b-lg border-t border-zinc-600 bg-zinc-600 px-3 py-1 text-sm text-zinc-300"
class="flex-grow-0 rounded-b-lg border-t border-zinc-600 bg-zinc-600 px-3 py-1 font-mono text-sm text-zinc-300"
>
{#if project.api}
<div class="flex flex-row items-center space-x-2 ">
<div class="h-2 w-2 rounded-full bg-green-700" />
<div class="text-zinc-400">syncing</div>
<div class="text-zinc-400">Backed-up</div>
</div>
{:else}
<div class="flex flex-row items-center space-x-2 ">
<div class="h-2 w-2 rounded-full bg-gray-400" />
<div class="text-zinc-400">offline</div>
<div class="text-zinc-400">Offline</div>
</div>
{/if}
</div>

2
src/routes/projects/[projectId]/+layout.svelte
View File

@ -126,7 +126,7 @@
</a>
<a target="_blank" rel="noreferrer" href={projectUrl($project)} class="flex">
<div class="leading-5">Open in GitButler Cloud</div>
<div class="icon h-5 w-5 ml-1">
<div class="icon ml-1 h-5 w-5">
<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"
><path
fill="#52525B"

16
src/routes/projects/[projectId]/+layout.ts
View File

@ -7,6 +7,7 @@ import type { Status } from '$lib/statuses';
import { asyncDerived } from '@square/svelte-store';
import type { Delta } from '$lib/deltas';
import { startOfDay } from 'date-fns';
import type { Activity } from '$lib/sessions';
export const prerender = false;
export const load: LayoutLoad = async ({ parent, params }) => {
@ -22,6 +23,18 @@ export const load: LayoutLoad = async ({ parent, params }) => {
const orderedSessions = derived(sessions, (sessions) => {
return sessions.slice().sort((a, b) => a.meta.startTimestampMs - b.meta.startTimestampMs);
});
const recentActivity = derived(sessions, (sessions) => {
const recentActivity: Activity[] = [];
sessions.forEach((session) => {
session.activity.forEach((activity) => {
recentActivity.push(activity);
});
});
const activitySorted = recentActivity.sort((a, b) => {
return b.timestampMs - a.timestampMs;
});
return activitySorted.slice(0, 20);
});
let dateSessions = readable<Record<number, UISession[]>>({});
if (!building) {
@ -80,6 +93,7 @@ export const load: LayoutLoad = async ({ parent, params }) => {
projectId: params.projectId,
sessions: orderedSessions,
dateSessions: dateSessions,
filesStatus: filesStatus
filesStatus: filesStatus,
recentActivity: recentActivity
};
};

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

@ -10,6 +10,7 @@
$: project = data.project;
$: dateSessions = data.dateSessions as Readable<Record<number, UISession[]>>;
$: filesStatus = data.filesStatus;
$: recentActivity = data.recentActivity as Readable<Activity[]>;
// convert a list of timestamps to a sparkline
function timestampsToSpark(tsArray: number[]) {
@ -85,25 +86,6 @@
})
.slice(0, 3);
}
function recentActivity(dateSessions: Record<string, UISession[]>) {
let recentActivity: Activity[] = [];
if (dateSessions) {
Object.entries(dateSessions).forEach(([date, sessions]) => {
sessions.forEach((session: UISession) => {
if (session.session) {
session.session.activity.forEach((activity) => {
recentActivity.push(activity);
});
}
});
});
}
let activitySorted = recentActivity.sort((a, b) => {
return b.timestampMs - a.timestampMs;
});
return activitySorted.slice(0, 20);
}
</script>
<div class="project-section-component" style="height: calc(100vh - 118px); overflow: hidden;">
@ -116,10 +98,10 @@
{$project?.title} <span class="ml-2 text-zinc-600">Project</span>
</h1>
<div class="mt-4">
<div class="recent-file-changes-container w-full h-full">
<div class="recent-file-changes-container h-full w-full">
<h2 class="mb-4 px-8 text-lg font-bold text-zinc-300">Recent File Changes</h2>
{#if $dateSessions === undefined}
<div class="p-8 text-zinc-400 text-center">Loading...</div>
<div class="p-8 text-center text-zinc-400">Loading...</div>
{:else}
<div
class="flex flex-col space-y-4 overflow-y-auto px-8 pb-8"
@ -136,7 +118,7 @@
})}
</div>
<div
class="results-card rounded bg-[#2F2F33] border border-zinc-700 p-4 drop-shadow-lg"
class="results-card rounded border border-zinc-700 bg-[#2F2F33] p-4 drop-shadow-lg"
>
{#each Object.entries(fileSessions) as filetime}
<div class="flex flex-row justify-between">
@ -162,9 +144,9 @@
<h2 class="mb-2 text-lg font-bold text-zinc-300">Work in Progress</h2>
{#if $filesStatus.length == 0}
<div
class="flex align-middle rounded border border-green-700 bg-green-900 p-4 text-green-400"
class="flex rounded border border-green-700 bg-green-900 p-4 align-middle text-green-400"
>
<div class="icon h-5 w-5 mr-2">
<div class="icon mr-2 h-5 w-5">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"
><path
fill="#4ADE80"
@ -199,12 +181,12 @@
style="height: calc(100vh - 110px); overflow-y: auto;"
>
<h2 class="text-lg font-bold text-zinc-300">Recent Activity</h2>
{#each recentActivity($dateSessions) as activity}
{#each $recentActivity as activity}
<div
class="recent-activity-card mt-4 mb-1 rounded border border-zinc-700 text-zinc-400 drop-shadow-lg"
>
<div class="flex flex-col p-3 rounded bg-[#2F2F33]">
<div class="flex flex-row justify-between text-zinc-500 pb-2">
<div class="flex flex-col rounded bg-[#2F2F33] p-3">
<div class="flex flex-row justify-between pb-2 text-zinc-500">
<div class="">
{new Date(activity.timestampMs).toLocaleDateString('en-us', {
weekday: 'short',

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

@ -154,7 +154,7 @@
<!-- Day -->
<div
id={dateMilliseconds}
class="session-day-component flex flex-col rounded-lg bg-[#2F2F33] border border-zinc-700"
class="session-day-component flex flex-col rounded-lg border border-zinc-700 bg-[#2F2F33]"
class:min-w-full={selection.dateMilliseconds == +dateMilliseconds}
>
<div