GitFOSS

// 1st-party
import type { ReactView } from "@ethicdevs/react-monolith";
// 3rd-party
import React from "react";
// generated via script[prisma:generate]
import type { Organization, Repository, User } from "@prisma/client";
// app service
import type { LinguistFileInfos } from "../../services/codeAnalysis/types";
// app
import type { CommonProps, RepositoryFileContent } from "../../types";
import {
  Code,
  Grid,
  Layout,
  PageWrapper,
  getThemedCodeCss,
  Card,
} from "../../components";

export interface RepositoryBrowserViewProps extends CommonProps {
  currentUser: null | User;
  fileContent: RepositoryFileContent;
  linguistInfos: LinguistFileInfos;
  parentOrg: Organization;
  path: string;
  ref: string;
  repo: Repository;
}

const RepositoryBrowserView: ReactView<RepositoryBrowserViewProps> = ({
  commonProps,
  fileContent,
  linguistInfos,
  parentOrg,
  path,
  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>
          {" / "}
          {path}
        </h1>
        <Grid.Col fluid>
          <Grid.Row
            nowrap
            alignItems={"center"}
            style={{ width: "100%", marginTop: 16 }}
          >
            <div>
              <strong>lang:</strong> <span>{linguistInfos.language}</span>
            </div>
            <div style={{ marginLeft: 16 }}>
              <strong>mime:</strong> <span>{linguistInfos.mimeType}</span>
            </div>
          </Grid.Row>
          {linguistInfos.type === "image" ? (
            <Card
              style={{ width: "100%" }}
              themeScheme={commonProps.themeScheme}
            >
              <img
                src={fileContent.content}
                style={{ width: "100%", height: "auto" }}
              />
            </Card>
          ) : (
            <>
              {getThemedCodeCss(commonProps.themeScheme)}
              <Code
                code={fileContent.content}
                language={linguistInfos.language}
                themeScheme={commonProps.themeScheme}
              />
            </>
          )}
        </Grid.Col>
      </PageWrapper>
    </Layout>
  );
};

RepositoryBrowserView.displayName = "RepositoryBrowserView";
export default RepositoryBrowserView;