mirror of
https://github.com/sourcebot-dev/sourcebot.git
synced 2025-12-12 04:15:30 +00:00
redirect to browse in repo carousel
This commit is contained in:
parent
68107da7dc
commit
06ac52d8bf
1 changed files with 19 additions and 10 deletions
|
|
@ -11,6 +11,10 @@ import Image from "next/image";
|
||||||
import { FileIcon } from "@radix-ui/react-icons";
|
import { FileIcon } from "@radix-ui/react-icons";
|
||||||
import clsx from "clsx";
|
import clsx from "clsx";
|
||||||
import { RepositoryQuery } from "@/lib/types";
|
import { RepositoryQuery } from "@/lib/types";
|
||||||
|
import Link from "next/link";
|
||||||
|
import { getBrowsePath } from "../../browse/hooks/useBrowseNavigation";
|
||||||
|
import { useMemo } from "react";
|
||||||
|
import { useDomain } from "@/hooks/useDomain";
|
||||||
|
|
||||||
interface RepositoryCarouselProps {
|
interface RepositoryCarouselProps {
|
||||||
repos: RepositoryQuery[];
|
repos: RepositoryQuery[];
|
||||||
|
|
@ -56,7 +60,9 @@ interface RepositoryBadgeProps {
|
||||||
const RepositoryBadge = ({
|
const RepositoryBadge = ({
|
||||||
repo
|
repo
|
||||||
}: RepositoryBadgeProps) => {
|
}: RepositoryBadgeProps) => {
|
||||||
const { repoIcon, displayName, repoLink } = (() => {
|
const domain = useDomain();
|
||||||
|
|
||||||
|
const { repoIcon, displayName, repoLink } = useMemo(() => {
|
||||||
const info = getCodeHostInfoForRepo({
|
const info = getCodeHostInfoForRepo({
|
||||||
codeHostType: repo.codeHostType,
|
codeHostType: repo.codeHostType,
|
||||||
name: repo.repoName,
|
name: repo.repoName,
|
||||||
|
|
@ -64,6 +70,13 @@ const RepositoryBadge = ({
|
||||||
webUrl: repo.webUrl,
|
webUrl: repo.webUrl,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const link = getBrowsePath({
|
||||||
|
repoName: repo.repoName,
|
||||||
|
path: "",
|
||||||
|
pathType: "tree",
|
||||||
|
domain,
|
||||||
|
})
|
||||||
|
|
||||||
if (info) {
|
if (info) {
|
||||||
return {
|
return {
|
||||||
repoIcon: <Image
|
repoIcon: <Image
|
||||||
|
|
@ -72,7 +85,7 @@ const RepositoryBadge = ({
|
||||||
className={`w-4 h-4 ${info.iconClassName}`}
|
className={`w-4 h-4 ${info.iconClassName}`}
|
||||||
/>,
|
/>,
|
||||||
displayName: info.displayName,
|
displayName: info.displayName,
|
||||||
repoLink: info.repoLink,
|
repoLink: link,
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -81,15 +94,11 @@ const RepositoryBadge = ({
|
||||||
displayName: repo.repoName,
|
displayName: repo.repoName,
|
||||||
repoLink: undefined,
|
repoLink: undefined,
|
||||||
}
|
}
|
||||||
})();
|
}, [repo.codeHostType, repo.repoName, repo.repoDisplayName, repo.webUrl, domain]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<Link
|
||||||
onClick={() => {
|
href={repoLink ?? ""}
|
||||||
if (repoLink !== undefined) {
|
|
||||||
window.open(repoLink, "_blank");
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
className={clsx("flex flex-row items-center gap-2 border rounded-md p-2 text-clip", {
|
className={clsx("flex flex-row items-center gap-2 border rounded-md p-2 text-clip", {
|
||||||
"cursor-pointer": repoLink !== undefined,
|
"cursor-pointer": repoLink !== undefined,
|
||||||
})}
|
})}
|
||||||
|
|
@ -98,6 +107,6 @@ const RepositoryBadge = ({
|
||||||
<span className="text-sm font-mono">
|
<span className="text-sm font-mono">
|
||||||
{displayName}
|
{displayName}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</Link>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue