GitFOSS
William Nemenchaimprove user experience
a7cddb1 (parent 791e7f6)4/7/2024, 5:07:26 AM
.ts
TypeScript
(application/typescript)
// 1st-party
import type { ReactView } from "@ethicdevs/react-monolith";
// 3rd-party
import React from "react";
// generated via script[generate:prisma]
import type { Organization } from "@prisma/client";
// app
import type {
  CommonProps,
  RepositoryFileDiff,
  RepositoryObject,
  RepositoryWithForkedFromRepo,
} from "../../types";
import {
  Card,
  Grid,
  IslandWrapper,
  Layout,
  PageWrapper,
} from "../../components";
// app islands
import Code, { getThemedCodeCss } from "../../islands/Code";
import RepositoryCommitSummaryLine from "../../islands/RepositoryCommitSummaryLine";
import RepositoryFilesDiffsList from "../../islands/RepositoryFilesDiffsList";
import RepositoryHero from "../../islands/RepositoryHero";

export interface RepositoryShowObjectViewProps extends CommonProps {
  currentRef: string;
  gitObject: RepositoryObject;
  gitObjectDiffs: RepositoryFileDiff[] | null;
  parentOrg: Organization;
  repo: RepositoryWithForkedFromRepo;
}

const RepositoryShowObjectView: ReactView<RepositoryShowObjectViewProps> = ({
  commonProps,
  currentRef,
  gitObject,
  gitObjectDiffs,
  parentOrg,
  repo,
}) => {
  const totalAdditions = gitObjectDiffs?.reduce(
    (acc, obj) => (acc += obj.additions),
    0
  );
  const totalDeletions = gitObjectDiffs?.reduce(
    (acc, obj) => (acc += obj.deletions),
    0
  );

  return (
    <Layout {...commonProps}>
      <PageWrapper>
        <IslandWrapper data-islandid={`${RepositoryHero.name}$$0`}>
          <RepositoryHero
            forkedFromRepo={repo.forkedFromRepo}
            forksCount={repo.forks.length}
            parentOrg={parentOrg}
            path={gitObject.abbreviated_commit}
            repo={repo}
            separator={"~"}
          />
        </IslandWrapper>

        <Card
          data-islandid={`${RepositoryCommitSummaryLine.name}$$0`}
          style={{ width: "100%", marginTop: 32, padding: 8, gap: 8 }}
          themeScheme={commonProps.themeScheme}
        >
          <RepositoryCommitSummaryLine
            defaultFullSubjectVisible
            commit={gitObject}
            currentRef={currentRef}
            orgSlug={parentOrg.slug}
            repoSlug={repo.slug}
          />
          <Grid.Row fluid nowrap alignItems={"center"} gap={16}>
            <div style={{ color: "rgb(43, 176, 90)" }}>
              <strong>+</strong> <span>{totalAdditions}</span>
            </div>
            <div style={{ color: "rgb(215, 44, 44)" }}>
              <strong>-</strong> <span>{totalDeletions}</span>
            </div>
          </Grid.Row>
          {gitObject.body.trim() !== "" && (
            <div style={{ width: "100%" }}>
              {getThemedCodeCss(commonProps.themeScheme)}
              <div data-islandid={`${Code.name}$$0`} style={{ width: "100%" }}>
                <Code
                  language={"plain"}
                  code={gitObject.body}
                  themeScheme={commonProps.themeScheme}
                />
              </div>
            </div>
          )}
        </Card>

        {gitObjectDiffs != null && (
          <Card
            data-islandid={`${RepositoryFilesDiffsList.name}$$0`}
            style={{ width: "100%", marginTop: 8, padding: 0, border: "none" }}
            themeScheme={commonProps.themeScheme}
          >
            <RepositoryFilesDiffsList
              filesDiffs={gitObjectDiffs}
              themeScheme={commonProps.themeScheme}
              orgSlug={parentOrg.slug}
              repoSlug={repo.slug}
              commitHash={gitObject.commit}
            />
          </Card>
        )}
      </PageWrapper>
    </Layout>
  );
};

RepositoryShowObjectView.displayName = "RepositoryShowObjectView";
export default RepositoryShowObjectView;