Skip to content

Commit

Permalink
feat: update pr label
Browse files Browse the repository at this point in the history
  • Loading branch information
Gustav-Eikaas committed Aug 16, 2023
1 parent d613f3c commit 77a10ad
Showing 1 changed file with 332 additions and 10 deletions.
342 changes: 332 additions & 10 deletions libs/shared/src/packages/fusion-framework/createRender.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,8 @@ import { createRoot } from 'react-dom/client';

import { ApplicationInsights } from '@microsoft/applicationinsights-web';
import { useState } from 'react';
import { Button } from '@equinor/eds-core-react';
import { Button, CircularProgress } from '@equinor/eds-core-react';
import { QueryClient, QueryClientProvider, useQuery } from '@tanstack/react-query';

/**
* Facades the fusion-framework render setup, used in all apps
Expand Down Expand Up @@ -76,14 +77,18 @@ export function createRender(
};
}

const queryClient = new QueryClient();
function createPrLabel(prNumber: string, el: HTMLElement): VoidFunction {
const child = document.createElement('div');
child.id = '123';
child.id = 'PR_LABEL';
document.body.appendChild(child);

const root = createRoot(child);

root.render(<PRLabel prNumber={prNumber} />);
root.render(
<QueryClientProvider client={queryClient}>
<PRLabel prNumber={prNumber} />
</QueryClientProvider>
);

return () => {
root.unmount();
Expand All @@ -93,7 +98,34 @@ function createPrLabel(prNumber: string, el: HTMLElement): VoidFunction {

function PRLabel({ prNumber }: { prNumber: string }) {
const [isOpen, setIsOpen] = useState(true);
const { data, isLoading, error } = useQuery<PullRequest>(
['pulls', prNumber],
async () => {
const res = await fetch(
`https://api.github.com/repos/equinor/cc-components/pulls/${prNumber}`,
{ headers: { ['Accept']: 'application/vnd.github+json' } }
);
if (!res.status) {
throw new Error('Failed to load');
}
return await res.json();
},
{ suspense: false, useErrorBoundary: false }
);
if (!isOpen) return null;
if (isLoading) {
return (
<div>
Loading...
<CircularProgress size={48} />
</div>
);
}

if (error || !data) {
return <div>Failed to load pr {prNumber}</div>;
}

return (
<div
style={{
Expand All @@ -105,17 +137,307 @@ function PRLabel({ prNumber }: { prNumber: string }) {
background: 'orange',
padding: '10px',
display: 'flex',
flexDirection: 'column',
gap: '10px',
alignItems: 'center',
zIndex: 10,
minWidth: '200px',
maxWidth: '1000px',
}}
>
<a href={`https://github.com/equinor/cc-components/pull/${prNumber}`}>
PR: #{prNumber}
</a>
<Button variant="ghost_icon" onClick={() => setIsOpen(false)}>
X
</Button>
<section style={{ display: 'flex', gap: '10px', alignItems: 'center' }}>
{data.assignee && (
<img height={'40px'} width={'40px'} src={data.assignee?.avatar_url} />
)}

{data.state === 'open' ? <OpenPR /> : <MergedPr />}
<a href={`https://github.com/equinor/cc-components/pull/${prNumber}`}>
{data.title} #{prNumber}
</a>
<Button variant="ghost_icon" onClick={() => setIsOpen(false)}>
X
</Button>
</section>
</div>
);
}

export interface PullRequest {
url: string;
id: number;
node_id: string;
html_url: string;
diff_url: string;
patch_url: string;
issue_url: string;
number: number;
state: string;
locked: boolean;
title: string;
user: User;
body: string;
created_at: string;
updated_at: string;
closed_at: any;
merged_at: any;
merge_commit_sha: string;
assignee: Assignee | null;
assignees: Assignee[];
requested_reviewers: any[];
requested_teams: any[];
labels: Label[];
milestone: any;
draft: boolean;
commits_url: string;
review_comments_url: string;
review_comment_url: string;
comments_url: string;
statuses_url: string;
head: Head;
base: Base;
_links: Links;
author_association: string;
auto_merge: any;
active_lock_reason: any;
merged: boolean;
mergeable: boolean;
rebaseable: boolean;
mergeable_state: string;
merged_by: any;
comments: number;
review_comments: number;
maintainer_can_modify: boolean;
commits: number;
additions: number;
deletions: number;
changed_files: number;
}

export interface User {
login: string;
id: number;
node_id: string;
avatar_url: string;
gravatar_id: string;
url: string;
html_url: string;
followers_url: string;
following_url: string;
gists_url: string;
starred_url: string;
subscriptions_url: string;
organizations_url: string;
repos_url: string;
events_url: string;
received_events_url: string;
type: string;
site_admin: boolean;
}

export interface Assignee {
login: string;
id: number;
node_id: string;
avatar_url: string;
gravatar_id: string;
url: string;
html_url: string;
followers_url: string;
following_url: string;
gists_url: string;
starred_url: string;
subscriptions_url: string;
organizations_url: string;
repos_url: string;
events_url: string;
received_events_url: string;
type: string;
site_admin: boolean;
}

export interface Label {
id: number;
node_id: string;
url: string;
name: string;
color: string;
default: boolean;
description: string;
}

export interface Head {
label: string;
ref: string;
sha: string;
user: User;
repo: Repo;
}

export interface Repo {
id: number;
node_id: string;
name: string;
full_name: string;
private: boolean;
owner: Owner;
html_url: string;
description: string;
fork: boolean;
url: string;
forks_url: string;
keys_url: string;
collaborators_url: string;
teams_url: string;
hooks_url: string;
issue_events_url: string;
events_url: string;
assignees_url: string;
branches_url: string;
tags_url: string;
blobs_url: string;
git_tags_url: string;
git_refs_url: string;
trees_url: string;
statuses_url: string;
languages_url: string;
stargazers_url: string;
contributors_url: string;
subscribers_url: string;
subscription_url: string;
commits_url: string;
git_commits_url: string;
comments_url: string;
issue_comment_url: string;
contents_url: string;
compare_url: string;
merges_url: string;
archive_url: string;
downloads_url: string;
issues_url: string;
pulls_url: string;
milestones_url: string;
notifications_url: string;
labels_url: string;
releases_url: string;
deployments_url: string;
created_at: string;
updated_at: string;
pushed_at: string;
git_url: string;
ssh_url: string;
clone_url: string;
svn_url: string;
homepage: string;
size: number;
stargazers_count: number;
watchers_count: number;
language: string;
has_issues: boolean;
has_projects: boolean;
has_downloads: boolean;
has_wiki: boolean;
has_pages: boolean;
has_discussions: boolean;
forks_count: number;
mirror_url: any;
archived: boolean;
disabled: boolean;
open_issues_count: number;
license: License;
allow_forking: boolean;
is_template: boolean;
web_commit_signoff_required: boolean;
topics: any[];
visibility: string;
forks: number;
open_issues: number;
watchers: number;
default_branch: string;
}

export interface Owner {
login: string;
id: number;
node_id: string;
avatar_url: string;
gravatar_id: string;
url: string;
html_url: string;
followers_url: string;
following_url: string;
gists_url: string;
starred_url: string;
subscriptions_url: string;
organizations_url: string;
repos_url: string;
events_url: string;
received_events_url: string;
type: string;
site_admin: boolean;
}

export interface License {
key: string;
name: string;
spdx_id: string;
url: string;
node_id: string;
}

export interface Base {
label: string;
ref: string;
sha: string;
user: User;
repo: Repo;
}

export interface Links {
self: Self;
html: Html;
issue: Issue;
comments: Comments;
review_comments: ReviewComments;
review_comment: ReviewComment;
commits: Commits;
statuses: Statuses;
}

export interface Self {
href: string;
}

type Html = Self;
type Issue = Self;
type Comments = Self;
type ReviewComments = Self;
type ReviewComment = Self;
type Commits = Self;
type Statuses = Self;

const OpenPR = () => (
<svg
fill="green"
aria-label="Open Pull Request"
viewBox="0 0 16 16"
version="1.1"
width="40px"
height="40px"
role="img"
>
<path d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z"></path>
</svg>
);

const MergedPr = () => (
<svg
height="40px"
width="40px"
fill="purple"
viewBox="0 0 16 16"
version="1.1"
aria-hidden="true"
>
<path d="M5.45 5.154A4.25 4.25 0 0 0 9.25 7.5h1.378a2.251 2.251 0 1 1 0 1.5H9.25A5.734 5.734 0 0 1 5 7.123v3.505a2.25 2.25 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.95-.218ZM4.25 13.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm8.5-4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5ZM5 3.25a.75.75 0 1 0 0 .005V3.25Z"></path>
</svg>
);

0 comments on commit 77a10ad

Please sign in to comment.