GitFOSS

// 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 { NamedColors } from "../../utils/style";
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}
      showDrawerPrimary
      orgSlug={parentOrg.slug}
      repoSlug={repo.slug}
      currentRef={currentRef}
    >
      <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,
            backdropFilter: "blur(8px)",
            backgroundColor: NamedColors.CARD_ALPHA_01[commonProps.themeScheme],
            position: "sticky",
            top: 80,
            zIndex: 9000,
            borderRadius: 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;