chadtmiller.com/knotless
git that lives in your Atmosphere account
1
10
web: Every feed line names its repository, and stars read as others do
web/src/lib/molecules/FeedItem.svelte+6−6
| @@ -15,11 +15,11 @@ | ||
/** | ||
* A line of the feed: who did it, by picture and name, with a mark for | ||
* what kind of thing it was; a sentence; and what it brought or said. | ||
* The repository is named only when `named`, as it differs from the | ||
* line above; and on the account's own page, `own`, its picture and | ||
* name are left out. | ||
* Every line names its repository, so it reads alone however lines of | ||
* other repositories fall between; on the account's own page, `own`, | ||
* its picture and name are left out. | ||
*/ | ||
let { entry: x, named, own }: { entry: Entry; named: boolean; own: boolean } = $props(); | ||
let { entry: x, own }: { entry: Entry; own: boolean } = $props(); | ||
// The kinds this page knows; any other falls to the switch's default, as | ||
// its $type matches none of theirs. | ||
type Known = Extract<getFeed.EventView['action'], { $type: `dev.knotless.getFeed#${string}` }>; | ||
| @@ -78,11 +78,11 @@ | ||
const pushed = $derived(one?.branches[0]); | ||
</script> | ||
| ||
{#snippet where()}{named ? ' on ' : ''}{#if named}<RepoLink owner={x.repo.handle} name={x.repo.name} />{/if}{/snippet} | ||
{#snippet where()}{' on '}<RepoLink owner={x.repo.handle} name={x.repo.name} />{/snippet} | ||
{#snippet who()}{#if !own}<a class="who" href="/{urlPath(x.actor.handle)}">{x.actor.handle}</a>{/if}{own ? '' : ' '}{/snippet} | ||
{#snippet rest(b: { count: number; merges: number; elsewhere: number; ref: string }, listed: number)}<p class="feed-rest">{#if b.count > listed}<span class="feed-badge">+{b.count - listed} more</span>{/if}{#if b.merges}<span class="feed-badge">{b.merges === 1 ? '1 merge' : `${b.merges} merges`}</span>{/if}{#if b.elsewhere}<span class="feed-badge">{`+${b.elsewhere} from other branches`}</span>{/if}<a class="feed-log" href={log(b.ref)}>Commits →</a></p>{/snippet} | ||
| ||
<li class:light={x.kind === 'starred'}> | ||
<li> | ||
<Time at={x.createdAt} show={(at) => span(x.since, at)} /> | ||
<span class="feed-node" class:own>{#if !own}<Avatar name={x.actor.handle} did={x.actor.did} src={x.actor.avatar} />{/if}<span class="feed-kind {tone}"><Icon name={icon} /></span></span> | ||
<div class="grow"> | ||
web/src/lib/organisms/Feed.svelte+1−2
| @@ -30,8 +30,7 @@ | ||
<h2 class="feed-day" class:zoneless={!zone.tz}>{weekday(list[0].createdAt)}</h2> | ||
<ul class="feed"> | ||
{#each list as x, i (i)} | ||
{@const above = list[i - 1]} | ||
<FeedItem entry={x} named={!above || above.repo.did !== x.repo.did || above.repo.name !== x.repo.name} own={x.actor.did === owner && !(x.kind === 'starred' && x.actors.length > 1)} /> | ||
<FeedItem entry={x} own={x.actor.did === owner && !(x.kind === 'starred' && x.actors.length > 1)} /> | ||
{/each} | ||
</ul> | ||
{:else} | ||
web/src/app.css+0−3
| @@ -913,9 +913,6 @@ textarea.field{resize:vertical;font-family:var(--font-mono);font-size:var(--text | ||
.feed-kind.accent{color:var(--accent)} | ||
.feed-node.own .feed-kind{position:static;width:var(--avatar-md);height:var(--avatar-md)} | ||
.feed-node.own .feed-kind .i{width:var(--icon);height:var(--icon)} | ||
.feed>li.light{padding:var(--space-1) 0} | ||
.feed>li.light .grow{color:var(--mute);font-size:var(--text-sm)} | ||
.feed>li.light::before{top:calc(var(--space-1) + var(--avatar-md))} | ||
.feed-rest{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-1-5) var(--space-2);margin-top:var(--space-1);font-size:var(--text-sm);color:var(--mute)} | ||
.feed-badge{font:var(--text-xs) var(--font-mono);color:var(--faint);border:var(--border);border-radius:var(--radius-full);padding:0 var(--space-1-5);white-space:nowrap} | ||
.feed .feed-log{font-size:var(--text-xs);color:var(--accent);text-decoration:none;white-space:nowrap} | ||