GitFOSS

// 1st-party
import type { ReactIsland } from "@ethicdevs/react-monolith";
// 3rd-party
import React from "react";
import styled from "styled-components";
// generated via script[generate:prisma]
import { Repository, User } from "@prisma/client";

export interface RepositoryInitialSetupProps {
  currentUser: null | User;
  cloneUrl: {
    http: string;
    ssh: string;
  };
  ref: string;
  repo: Repository;
}

const RepositoryInitialSetup: ReactIsland<RepositoryInitialSetupProps> = ({
  cloneUrl,
  currentUser,
  repo,
}) => {
  return (
    <StyledRepositoryInitialSetupContainer>
      <p>It looks like this repository is empty.</p>
      <p>Get started easily:</p>
      <h3>Clone and initialize</h3>
      <code>
        <pre
          style={{ maxWidth: 600 }}
        >{`# Clone and enter the repository directory
      $ git clone ${cloneUrl.http}
      $ cd ${repo.slug}/
      ${
        currentUser != null
          ? `
      # Setup committer identity for this project
      $ git config user.name "${
        currentUser.displayName || currentUser.username
      }"
      $ git config user.email "${currentUser.email}"`
          : ""
      }

      # Create some base files
      $ echo "# ${repo.displayName || repo.slug}" > README.md
      $ echo "The MIT License" > LICENSE

      # Track files, commit and send to GitFOSS remote repository
      $ git add .
      $ git commit -am 'feat: initial commit'
      $ git push
      `}</pre>
      </code>
    </StyledRepositoryInitialSetupContainer>
  );
};

const StyledRepositoryInitialSetupContainer = styled.div`
  width: 100%;
`;

RepositoryInitialSetup.displayName = "RepositoryInitialSetup";
export default RepositoryInitialSetup;