diff --git a/src/components/repo/RepoActionControl.tsx b/src/components/repo/RepoActionControl.tsx
new file mode 100644
index 0000000..8f3d25e
--- /dev/null
+++ b/src/components/repo/RepoActionControl.tsx
@@ -0,0 +1,49 @@
+import type { ReactNode } from 'react'
+
+type RepoActionControlProps = {
+ ariaLabel: string
+ children: ReactNode
+ count?: ReactNode
+ countLabel?: string
+ href?: string
+}
+
+export function RepoActionControl({
+ ariaLabel,
+ children,
+ count,
+ countLabel,
+ href,
+}: RepoActionControlProps) {
+ const actionClassName =
+ 'flex size-10 items-center justify-center transition-colors hover:bg-ctp-surface-0'
+
+ return (
+
+ {href === undefined ? (
+
+ ) : (
+
+ {children}
+
+ )}
+
+ {count !== undefined && (
+
+ {count}
+
+ )}
+
+ )
+}
diff --git a/src/components/repo/RepoAtomFeed.tsx b/src/components/repo/RepoAtomFeed.tsx
new file mode 100644
index 0000000..7b8832d
--- /dev/null
+++ b/src/components/repo/RepoAtomFeed.tsx
@@ -0,0 +1,20 @@
+import type { Handle } from '@atcute/lexicons'
+import { IconRss } from '@tabler/icons-react'
+import { RepoActionControl } from './RepoActionControl'
+
+type RepoAtomFeedProps = {
+ handle: Handle
+ repoKey: string
+}
+
+export function RepoAtomFeed({ handle, repoKey }: RepoAtomFeedProps) {
+ const atomFeedUrl = `https://tangled.org/${encodeURIComponent(handle)}/${encodeURIComponent(repoKey)}/feed.atom`
+
+ return (
+
+
+
+
+
+ )
+}
diff --git a/src/components/repo/RepoStarCount.tsx b/src/components/repo/RepoStarCount.tsx
index bed9eb3..ce5d71f 100644
--- a/src/components/repo/RepoStarCount.tsx
+++ b/src/components/repo/RepoStarCount.tsx
@@ -1,16 +1,28 @@
import type { Did } from '@atcute/lexicons'
import { IconStar } from '@tabler/icons-react'
import { useRepoStarCount } from '../../hooks/useRepoStarCount'
+import { RepoActionControl } from './RepoActionControl'
type RepoStarCountProps = {
repoDid?: Did
+ variant?: 'count' | 'action'
}
-export function RepoStarCount({ repoDid }: RepoStarCountProps) {
+export function RepoStarCount({ repoDid, variant = 'count' }: RepoStarCountProps) {
const { starCount, hasFailed } = useRepoStarCount(repoDid)
if (repoDid === undefined) return null
+ const count = hasFailed ? '—' : (starCount ?? '…')
+
+ if (variant === 'action') {
+ return (
+
+
+
+ )
+ }
+
return (
- {hasFailed ? '—' : (starCount ?? '…')}
+ {count}
)
}
diff --git a/src/components/repo/RepoView.tsx b/src/components/repo/RepoView.tsx
index 3ca379e..b48a178 100644
--- a/src/components/repo/RepoView.tsx
+++ b/src/components/repo/RepoView.tsx
@@ -3,8 +3,9 @@ import Markdown from 'react-markdown'
import rehypeRaw from 'rehype-raw'
import rehypeSanitize from 'rehype-sanitize'
import type { Repo } from '../../lib/tangled'
-import { getRepoName } from '../../lib/tangled/repo'
+import { getRepoName, getRepoRkey } from '../../lib/tangled/repo'
import { SurfaceCard } from '../shared/SurfaceCard'
+import { RepoAtomFeed } from './RepoAtomFeed'
import { RepoCloneUrl } from './RepoCloneUrl'
import { RepoStarCount } from './RepoStarCount'
@@ -16,6 +17,7 @@ type RepoProps = {
export function RepoView({ handle, repo }: RepoProps) {
const { value } = repo
const name = getRepoName(repo)
+ const repoKey = getRepoRkey(repo)
const repoDid = value.repoDid
return (
@@ -29,7 +31,10 @@ export function RepoView({ handle, repo }: RepoProps) {
{value.knot && {value.knot}
}
-
+
+
+
+
{value.description && (