import type { ReactView } from "@ethicdevs/react-monolith";
import React from "react";
import type { Organization, Repository } from "@prisma/client";
import type { CommonProps, RepositoryLog } from "../../types";
import { Card, Layout, PageWrapper } from "../../components";
export interface RepositoryCommitsLogViewProps extends CommonProps {
history: RepositoryLog[];
parentOrg: Organization;
repo: Repository;
}
const RepositoryCommitsLogView: ReactView<RepositoryCommitsLogViewProps> = ({
commonProps,
history,
parentOrg,
repo,
}) => {
return (
<Layout {...commonProps}>
<PageWrapper>
<h1>
<a href={`/${parentOrg.slug}`}>
{parentOrg.displayName || parentOrg.slug}
</a>
{" / "}
<a href={`/${parentOrg.slug}/${repo.slug}`}>
{repo.displayName || repo.slug}
</a>
{" / Commits"}
</h1>
<Card
style={{ width: "100%", marginTop: 32 }}
themeScheme={commonProps.themeScheme}
>
{history.map((log) => (
<a
key={log.tree}
href={`/${parentOrg.slug}/${repo.slug}/compare/${log.abbreviated_parent}..${log.abbreviated_commit}`}
style={{ marginTop: 8 }}
>
<strong>{log.author.name}</strong>
{" ∙ "}
<span>{log.subject}</span>
{" - "}
<span>
{log.abbreviated_commit}
{log.abbreviated_parent.trim() != ""
? ` ∙ parent ${log.abbreviated_parent}`
: ""}
</span>
{" ∙ "}
<span>{new Date(log.author.date).toUTCString()}</span>
</a>
))}
</Card>
</PageWrapper>
</Layout>
);
};
RepositoryCommitsLogView.displayName = "RepositoryCommitsLogView";
export default RepositoryCommitsLogView;