| 1 | import { GitCommitHorizontal, GitPullRequest, CircleDot } from "lucide-react"; |
| 2 | import Link from "next/link |
| 3 | |
| 4 | import { FromNowHoverCard } |
| 5 | import { CommentItem } |
| 6 | import { commitRunAt, eventDescription |
| 7 | import { Markdown } |
| 8 | import { UserLink } |
| 9 | import { ReviewItem } |
| 10 | import type { IssueTimelineItem |
| 11 | |
| 12 | /** Comments, events and mentions from elsewhere, as one thread. Issues and pull requests share it because a pull request is an issue. */ |
| 13 | export function Timeline({ |
| 14 | username, |
| 15 | repo, |
| 16 | number, |
| 17 | viewer, |
| 18 | canModerate, |
| 19 | items, |
| 20 | noun, |
| 21 | headSha, |
| 22 | }: { |
| 23 | username: string |
| 24 | repo: string |
| 25 | number: number |
| 26 | viewer?: string |
| 27 | /** May edit and delete anyone's comments. */ |
| 28 | canModerate: boolean |
| 29 | items: IssueTimelineItem |
| 30 | noun: "issue |
| 31 | /** The request's current head, which line comments on another commit are outdated against. */ |
| 32 | headSha?: string |
| 33 | }) { |
| 34 | return items.map |
| 35 | if (item.kind |
| 36 | return ( |
| 37 | <ReviewItem |
| 38 | key={item.id |
| 39 | username={username} |
| 40 | repo={repo} |
| 41 | number={number} |
| 42 | viewer={viewer} |
| 43 | canModerate={canModerate} |
| 44 | review={item} |
| 45 | headSha={headSha ?? |
| 46 | /> |
| 47 | ); |
| 48 | } |
| 49 | |
| 50 | if (item.kind |
| 51 | return ( |
| 52 | <CommentItem |
| 53 | key={item.id |
| 54 | username={username} |
| 55 | repo={repo} |
| 56 | number={number} |
| 57 | commentId={item.id |
| 58 | authorUsername={item.authorUsername |
| 59 | body={item.body |
| 60 | viewer={viewer} |
| 61 | canModerate={canModerate} |
| 62 | header={ |
| 63 | <> |
| 64 | <UserLink |
| 65 | username={item.authorUsername |
| 66 | image={item.authorImage |
| 67 | avatar="sm" |
| 68 | /> |
| 69 | commented <FromNowHoverCard date={ |
| 70 | </> |
| 71 | } |
| 72 | > |
| 73 | <Markdown repository={ |
| 74 | </CommentItem> |
| 75 | ); |
| 76 | } |
| 77 | |
| 78 | if (item.kind |
| 79 | const run = |
| 80 | if (!run) |
| 81 | return ( |
| 82 | <div key={item |
| 83 | <p className="text-muted-foreground |
| 84 | <UserLink |
| 85 | username={item.event |
| 86 | image={item.event |
| 87 | avatar="xs" |
| 88 | className="align-middle" |
| 89 | />{" "} |
| 90 | added {run.length} { |
| 91 | <FromNowHoverCard date={ |
| 92 | </p> |
| 93 | <ul className="ml-1.5 flex flex-col gap-1 border-l pl-4 |
| 94 | {run.map(( |
| 95 | <li key={commit |
| 96 | <GitCommitHorizontal className=" |
| 97 | <span className="truncate text-foreground |
| 98 | {commit.commitMessage} |
| 99 | </span> |
| 100 | <span className="hidden shrink-0 text-muted-foreground sm:inline |
| 101 | {commit.commitAuthorName} |
| 102 | </span> |
| 103 | <Link |
| 104 | href={`/${username |
| 105 | className="ml-auto shrink-0 font-mono text-muted-foreground hover:text-foreground hover:underline" |
| 106 | > |
| 107 | {commit.commitSha?.slice |
| 108 | </Link> |
| 109 | </li> |
| 110 | ))} |
| 111 | </ul> |
| 112 | </div> |
| 113 | ); |
| 114 | } |
| 115 | |
| 116 | if (item.kind |
| 117 | const { event |
| 118 | return ( |
| 119 | <p key={item |
| 120 | <UserLink |
| 121 | username={event.actorUsername |
| 122 | image={event.actorImage |
| 123 | avatar="xs" |
| 124 | className="align-middle" |
| 125 | />{" "} |
| 126 | force-pushed the branch from{" "} |
| 127 | <code className="font-mono text-foreground |
| 128 | {event.beforeSha?.slice |
| 129 | </code>{" "} |
| 130 | to{" "} |
| 131 | <Link |
| 132 | href={`/${username |
| 133 | className="font-mono text-foreground hover:underline" |
| 134 | > |
| 135 | {event.commitSha?.slice |
| 136 | </Link>{" " |
| 137 | · <FromNowHoverCard date={ |
| 138 | </p> |
| 139 | ); |
| 140 | } |
| 141 | |
| 142 | if (item.kind |
| 143 | const { event |
| 144 | return ( |
| 145 | <p key={item |
| 146 | <UserLink |
| 147 | username={event.actorUsername |
| 148 | image={event.actorImage |
| 149 | avatar="xs" |
| 150 | className="align-middle" |
| 151 | />{" "} |
| 152 | {eventDescription(event, |
| 153 | {event.sourceRepository && |
| 154 | <> |
| 155 | {" in "} |
| 156 | <Link |
| 157 | href={`/${event |
| 158 | className="text-foreground hover:underline" |
| 159 | > |
| 160 | {event.sourceRepository === |
| 161 | ? `#${event. |
| 162 | : `${event.sourceRepository |
| 163 | </Link> |
| 164 | </> |
| 165 | )} |
| 166 | {!event.sourceRepository |
| 167 | <> |
| 168 | {" in "} |
| 169 | <code className="font-mono text-foreground |
| 170 | {event.commitSha.slice |
| 171 | </code> |
| 172 | </> |
| 173 | )}{" "} |
| 174 | · <FromNowHoverCard date={ |
| 175 | </p> |
| 176 | ); |
| 177 | } |
| 178 | |
| 179 | const base = |
| 180 | const elsewhere = |
| 181 | return ( |
| 182 | <p |
| 183 | key={item.id |
| 184 | className="flex flex-wrap items-center gap-1 px-4 text-xs text-muted-foreground" |
| 185 | > |
| 186 | {item.source ? |
| 187 | item.source.isPullRequest |
| 188 | <GitPullRequest className=" |
| 189 | ) : ( |
| 190 | <CircleDot className=" |
| 191 | ) |
| 192 | ) : ( |
| 193 | <GitCommitHorizontal className=" |
| 194 | )} |
| 195 | <UserLink username={ |
| 196 | {item.source ? |
| 197 | <Link |
| 198 | href={`${base |
| 199 | className="text-foreground hover:underline" |
| 200 | > |
| 201 | {item.source.title |
| 202 | <span className="text-muted-foreground |
| 203 | {elsewhere && |
| 204 | `${item.repository. |
| 205 | #{item.source.number |
| 206 | </span> |
| 207 | </Link> |
| 208 | ) : ( |
| 209 | item.commitSha && |
| 210 | <Link |
| 211 | href={`${base |
| 212 | className="font-mono text-foreground hover:underline" |
| 213 | > |
| 214 | {elsewhere && |
| 215 | `${item.repository. |
| 216 | {item.commitSha.slice |
| 217 | </Link> |
| 218 | ) |
| 219 | )} |
| 220 | · <FromNowHoverCard date={ |
| 221 | </p> |
| 222 | ); |
| 223 | }); |
| 224 | } |