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 type { Repository, User } from "@prisma/client";

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

const RepositoryInitialSetup: ReactIsland<RepositoryInitialSetupProps> = ({
  cloneUrl,
  currentRef,
  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}"
`
    : "\n"
}
# 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 -u origin ${currentRef}
      `}</pre>
      </code>
    </StyledRepositoryInitialSetupContainer>
  );
};

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

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