import clsx from 'clsx';
import { File, Folder, GitBranch, GitCommitHorizontal, List } from 'lucide-solid';
import { A, useNavigate, useParams } from '@solidjs/router';
import { createQuery, keepPreviousData, useQueryClient } from '@tanstack/solid-query';
import { For, Match, Show, Switch, createEffect, createMemo, createSignal, type Accessor, type Component } from 'solid-js';
import { buildBlobDataUrl, decodeBlobText, getRepoBlob, getRepoBranches, getRepoDefaultBranch, getRepoLanguages, getRepoLog, getRepoTags, getRepoTree, type CommitHeadline } from '../../lib/api/repos';
import { For, Match, Show, Switch, createEffect, createMemo, createSignal, onCleanup, type Accessor, type Component } from 'solid-js';
import { buildBlobDataUrl, decodeBlobBytes, decodeBlobText, getRepoBlob, getRepoBranches, getRepoDefaultBranch, getRepoLanguages, getRepoLog, getRepoTags, getRepoTree, type CommitHeadline } from '../../lib/api/repos';
import { Avatar, ErrorState, PlaceholderAvatar, buttonStyles, cardStyles } from '../../components/common';
import { CloneDropdown, CodeView, FileRow, MarkdownBlock, OverviewFileRow, ReadmeCard, RepoBlobSkeleton, RepoLanguageBarSkeleton, RepoTreeSkeleton } from '../../components/repo';
import { RepoFrame, useRepoQuery } from './shared';
import { blobHref, commitHref, commitsHref, countLines, decodeRoutePath, formatBytes, formatLanguagePercent, formatRelativeTime, getErrorMessage, getParentPath, imageLike, isDirectory, joinPath, languageColor, markdownLike, safeDecode, sortedTreeEntries, svgLike, treeHref, updateRecentRepoLanguage, videoLike } from '../../lib/repo-utils';
887 unmodified lines
Expand all
);
const lineCount = createMemo(() => countLines(text()));
const commitLink = (commit: Accessor<CommitHeadline>) => `/${repo.owner.handle}/${repo.slug}/commit/${commit().hash}`;
const [blobUrl, setBlobUrl] = createSignal<string>();
createEffect(() => {
const bytes = decodeBlobBytes(blob);
const webBlob = new Blob([bytes.buffer as any], { type: blob.mimeType });
const url = URL.createObjectURL(webBlob);
setBlobUrl(url);
onCleanup(() => URL.revokeObjectURL(url));
});
return (
<div class="untangled-blob-card peer">
<div class="untangled-blob-header pb-2 mb-3 text-base border-b border-gray-200 dark:border-gray-700">
<div class="flex flex-col md:flex-row md:justify-between gap-2">
<Show when={blob.size}>
<span class="select-none px-1 md:px-2">·</span>
<span>{formatBytes(blob.size!)}</span>
</Show>
<Show when={rawUrl()}>
<Show when={blobUrl()}>
<span class="select-none px-1 md:px-2">·</span>
<a href={rawUrl()!} target="_blank" rel="noreferrer" class="hover:underline">
<a href={blobUrl()!} target="_blank" rel="noreferrer" class="hover:underline">
view raw
</a>
</Show>
<Show when={isMarkdown() || isSvg()}>