Skip to content

Prettify codebase #8

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Prettify codebase #8

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
79 changes: 40 additions & 39 deletions components/StatusPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,26 @@
import React, { useEffect } from "react";
import styled from "styled-components";
import { useRouter } from "next/router";
import JavascriptTimeAgo from "javascript-time-ago";
import React, { useEffect } from 'react';
import styled from 'styled-components';
import { useRouter } from 'next/router';
import JavascriptTimeAgo from 'javascript-time-ago';
// The desired locales.
import en from "javascript-time-ago/locale/en";

import { HEADER_HEIGHT } from "./Header";
import { StatusListItem } from "./StatusListItem";
import { StatusList } from "./StatusList";
import { Details } from "./Details";
import { IPR, IBuild, getPrs, getBuilds, getPr } from "../utils/api";
import { Layout } from "./Layout";
import { SkeletonStatusPage } from "./SkeletonStatusPage";
import { useGlobalState } from "../utils/state";
import { colors } from "../theme/colors";
import en from 'javascript-time-ago/locale/en';

import { HEADER_HEIGHT } from './Header';
import { StatusListItem } from './StatusListItem';
import { StatusList } from './StatusList';
import { Details } from './Details';
import { IPR, IBuild, getPrs, getBuilds, getPr } from '../utils/api';
import { Layout } from './Layout';
import { SkeletonStatusPage } from './SkeletonStatusPage';
import { useGlobalState } from '../utils/state';
import { colors } from '../theme/colors';
import {
LEARN_MORE_DOCUMENT_URL,
INSTALL_GITHUB_URL
} from "../utils/constants";
import { BUILD_LINK, buildLink, PR_LINK, prLink } from "../utils/url";
import { SetupPage } from "./SetupPage";
import { Button } from "./_elements";
INSTALL_GITHUB_URL,
} from '../utils/constants';
import { BUILD_LINK, buildLink, PR_LINK, prLink } from '../utils/url';
import { SetupPage } from './SetupPage';
import { Button } from './_elements';

// Initialize the desired locales.
JavascriptTimeAgo.locale(en);
Expand All @@ -44,22 +44,22 @@ const ErrorMessage = styled.p`
const WrapperPRS = styled.div<WrapperProps>`
@media screen and (max-width: 768px) {
display: ${props =>
props.selectedPr || props.selectedBuild ? "none" : "block"};
props.selectedPr || props.selectedBuild ? 'none' : 'block'};
width: 100%;
}
`;

const WrapperBuilds = styled.div<WrapperProps>`
@media screen and (max-width: 768px) {
display: ${props =>
!props.selectedPr || props.selectedBuild ? "none" : "block"};
!props.selectedPr || props.selectedBuild ? 'none' : 'block'};
width: 100%;
}
`;

const WrapperDetails = styled.div<WrapperProps>`
@media screen and (max-width: 768px) {
display: ${props => (!props.selectedBuild ? "none" : "block")};
display: ${props => (!props.selectedBuild ? 'none' : 'block')};
}
width: 100%;
overflow: hidden;
Expand All @@ -86,9 +86,9 @@ const StatusPage = ({
builds,
notFound,
showSetup,
error
error,
}: StatusPageProps) => {
const [statePrs, setPrs] = useGlobalState("prs");
const [statePrs, setPrs] = useGlobalState('prs');
const usedPrs = statePrs || prs;
const { query: params } = useRouter();

Expand All @@ -104,9 +104,9 @@ const StatusPage = ({
return (
<SkeletonStatusPage>
<ErrorMessage>
{typeof error === "string"
{typeof error === 'string'
? error
: "We could not find the repository you were looking for, have you installed the GitHub App?"}
: 'We could not find the repository you were looking for, have you installed the GitHub App?'}
</ErrorMessage>

<Button href={INSTALL_GITHUB_URL}>Install GitHub App</Button>
Expand Down Expand Up @@ -178,7 +178,7 @@ const StatusPage = ({
selected={pr.number === selectedPrNumber}
link={{
href: PR_LINK,
as: prLink(username, repo, pr.number)
as: prLink(username, repo, pr.number),
}}
/>
))}
Expand All @@ -199,7 +199,7 @@ const StatusPage = ({
selected={build.id === selectedBuildId}
link={{
href: BUILD_LINK,
as: buildLink(username, repo, selectedPrNumber, build.id)
as: buildLink(username, repo, selectedPrNumber, build.id),
}}
/>
))}
Expand All @@ -224,7 +224,7 @@ const StatusPage = ({
function getTitle(username: string, repo: string, buildId?: number) {
let title = `${username}/${repo}`;

if (typeof buildId !== "undefined") {
if (typeof buildId !== 'undefined') {
title += ` #${buildId}`;
}

Expand All @@ -233,31 +233,32 @@ function getTitle(username: string, repo: string, buildId?: number) {

StatusPage.getInitialProps = async ({
query,
res
res,
}): Promise<
{ title?: string } & (
| StatusPageProps
| { notFound: true; error?: string }
| { showSetup: true }
| { error: true })
| { error: true }
)
> => {
try {
const { username, repo } = query;

if (!username) {
throw new Error("Please define a username");
throw new Error('Please define a username');
}

if (!repo) {
throw new Error("Please define a repo");
throw new Error('Please define a repo');
}

const { prs } = await getPrs(username, repo);

if (prs.length === 0) {
// No PRs have been registered yet

return { showSetup: true, title: "CodeSandbox CI Installed" };
return { showSetup: true, title: 'CodeSandbox CI Installed' };
}

let prNumber = query.prNumber;
Expand All @@ -274,7 +275,7 @@ StatusPage.getInitialProps = async ({
} catch (e) {
return {
notFound: true,
error: "We could not find the PR you were looking for"
error: 'We could not find the PR you were looking for',
};
}
prs.unshift(selectedPR);
Expand Down Expand Up @@ -302,7 +303,7 @@ StatusPage.getInitialProps = async ({
repo,
selectedPR.number,
selectedPR.latestBuild.id
)
),
});
res.end();
return;
Expand All @@ -316,7 +317,7 @@ StatusPage.getInitialProps = async ({
builds,
selectedPrNumber: prNumber,
selectedBuildId: buildId,
title: getTitle(username, repo, buildId)
title: getTitle(username, repo, buildId),
};
} catch (e) {
console.error(e);
Expand All @@ -326,7 +327,7 @@ StatusPage.getInitialProps = async ({
}

if (e.response.status === 404) {
return { notFound: true, title: "Not Found" };
return { notFound: true, title: 'Not Found' };
} else {
return { error: true };
}
Expand Down