Introduce internal isProvidedViaProps for when project is provided via props

Signed-off-by: Erik Engervall <erik.engervall@gmail.com>
This commit is contained in:
Erik Engervall
2021-04-18 17:13:29 +02:00
parent 56825a2add
commit 2a98141a1c
10 changed files with 116 additions and 34 deletions
+56 -5
View File
@@ -16,6 +16,7 @@
import React from 'react';
import { createDevApp } from '@backstage/dev-utils';
import { Alert } from '@material-ui/lab';
import {
gitHubReleaseManagerPlugin,
@@ -29,19 +30,69 @@ function DevWrapper({ children }: { children: React.ReactNode }) {
createDevApp()
.registerPlugin(gitHubReleaseManagerPlugin)
.addPage({
title: 'Page 1',
title: 'Dynamic',
element: (
<>
<Alert severity="info">Configure via select inputs</Alert>
<DevWrapper>
<GitHubReleaseManagerPage />
</DevWrapper>
</>
),
})
.addPage({
title: 'Static',
element: (
<DevWrapper>
<GitHubReleaseManagerPage />
<Alert severity="info">Statically configured via props</Alert>
<GitHubReleaseManagerPage
project={{
owner: 'eengervall-playground',
repo: 'RMaaS-semver',
versioningStrategy: 'semver',
}}
/>
</DevWrapper>
),
})
.addPage({
title: 'Page 2',
title: 'Omit',
element: (
<DevWrapper>
{' '}
<GitHubReleaseManagerPage />
<Alert severity="info">Optionally omit components</Alert>
<GitHubReleaseManagerPage
project={{
owner: 'eengervall-playground',
repo: 'playground-semver',
versioningStrategy: 'semver',
}}
components={{
createRc: {
successCb: ({
comparisonUrl,
createdTag,
gitHubReleaseName,
gitHubReleaseUrl,
previousTag,
}) => {
// eslint-disable-next-line no-console
console.log(
'Custom success callback for Create RC',
comparisonUrl,
createdTag,
gitHubReleaseName,
gitHubReleaseUrl,
previousTag,
);
},
},
promoteRc: { omit: true },
patch: { omit: true },
}}
/>
</DevWrapper>
),
})
@@ -20,6 +20,7 @@ import { Alert } from '@material-ui/lab';
import { useApi, ContentHeader } from '@backstage/core';
import {
ComponentConfig,
ComponentConfigCreateRc,
ComponentConfigPatch,
ComponentConfigPromoteRc,
@@ -36,28 +37,32 @@ import { useQueryHandler } from './hooks/useQueryHandler';
import { useStyles } from './styles/styles';
export interface GitHubReleaseManagerProps {
project?: Omit<Project, 'isProvidedViaProps'>;
components?: {
default?: {
createRc?: ComponentConfigCreateRc;
promoteRc?: ComponentConfigPromoteRc;
patch?: ComponentConfigPatch;
};
info?: Pick<ComponentConfig<void>, 'omit'>;
createRc?: ComponentConfigCreateRc;
promoteRc?: ComponentConfigPromoteRc;
patch?: ComponentConfigPatch;
};
}
export function GitHubReleaseManager({
components,
}: GitHubReleaseManagerProps) {
export function GitHubReleaseManager(props: GitHubReleaseManagerProps) {
const pluginApiClient = useApi(githubReleaseManagerApiRef);
const classes = useStyles();
const { getParsedQuery } = useQueryHandler();
const { parsedQuery } = getParsedQuery();
const project: Project = {
owner: parsedQuery.owner ?? '',
repo: parsedQuery.repo ?? '',
versioningStrategy: parsedQuery.versioningStrategy ?? 'semver',
};
const project: Project = isProjectValid(props.project)
? {
...props.project,
isProvidedViaProps: true,
}
: {
owner: parsedQuery.owner ?? '',
repo: parsedQuery.repo ?? '',
versioningStrategy: parsedQuery.versioningStrategy ?? 'semver',
isProvidedViaProps: false,
};
const usernameResponse = useAsync(() =>
pluginApiClient.getUsername({ owner: project.owner, repo: project.repo }),
@@ -85,7 +90,7 @@ export function GitHubReleaseManager({
<RepoDetailsForm username={usernameResponse.value.username} />
</InfoCardPlus>
{isProjectValid(project) && <Cards components={components} />}
{isProjectValid(project) && <Cards components={props.components} />}
</div>
</ProjectContext.Provider>
</PluginApiClientContext.Provider>
@@ -94,32 +94,34 @@ export function Cards({
</Alert>
)}
<Info
latestRelease={gitHubBatchInfo.value.latestRelease}
releaseBranch={gitHubBatchInfo.value.releaseBranch}
/>
{components?.info?.omit !== true && (
<Info
latestRelease={gitHubBatchInfo.value.latestRelease}
releaseBranch={gitHubBatchInfo.value.releaseBranch}
/>
)}
{components?.default?.createRc?.omit !== true && (
{components?.createRc?.omit !== true && (
<CreateRc
latestRelease={gitHubBatchInfo.value.latestRelease}
releaseBranch={gitHubBatchInfo.value.releaseBranch}
defaultBranch={gitHubBatchInfo.value.repository.defaultBranch}
successCb={components?.default?.createRc?.successCb}
successCb={components?.createRc?.successCb}
/>
)}
{components?.default?.promoteRc?.omit !== true && (
{components?.promoteRc?.omit !== true && (
<PromoteRc
latestRelease={gitHubBatchInfo.value.latestRelease}
successCb={components?.default?.promoteRc?.successCb}
successCb={components?.promoteRc?.successCb}
/>
)}
{components?.default?.patch?.omit !== true && (
{components?.patch?.omit !== true && (
<Patch
latestRelease={gitHubBatchInfo.value.latestRelease}
releaseBranch={gitHubBatchInfo.value.releaseBranch}
successCb={components?.default?.patch?.successCb}
successCb={components?.patch?.successCb}
/>
)}
</ErrorBoundary>
@@ -46,7 +46,12 @@ export function Owner({ username }: { username: string }) {
.includes(project.owner);
return (
<FormControl className={formClasses.formControl} required error={!!error}>
<FormControl
className={formClasses.formControl}
required
disabled={project.isProvidedViaProps}
error={!!error}
>
{loading ? (
<CenteredCircularProgress data-testid={TEST_IDS.form.owner.loading} />
) : (
@@ -52,7 +52,12 @@ export function Repo() {
const customRepoFromUrl = !repositories.concat(['']).includes(project.repo);
return (
<FormControl className={formClasses.formControl} required error={!!error}>
<FormControl
className={formClasses.formControl}
required
disabled={project.isProvidedViaProps}
error={!!error}
>
{loading ? (
<CenteredCircularProgress data-testid={TEST_IDS.form.repo.loading} />
) : (
@@ -36,7 +36,7 @@ export function VersioningStrategy() {
useEffect(() => {
const { parsedQuery } = getParsedQuery();
if (!parsedQuery.versioningStrategy) {
if (!parsedQuery.versioningStrategy && !project.isProvidedViaProps) {
const { queryParams } = getQueryParamsWithUpdates({
updates: [
{ key: 'versioningStrategy', value: project.versioningStrategy },
@@ -48,7 +48,11 @@ export function VersioningStrategy() {
}, []); // eslint-disable-line react-hooks/exhaustive-deps
return (
<FormControl component="fieldset" required>
<FormControl
component="fieldset"
required
disabled={project.isProvidedViaProps}
>
<FormLabel component="legend">Calendar strategy</FormLabel>
<RadioGroup
data-testid={TEST_IDS.form.versioningStrategy.radioGroup}
@@ -40,6 +40,12 @@ export interface Project {
* Default: false
*/
versioningStrategy: 'calver' | 'semver';
/**
* Project props was provided via props
*
* If true, this means select inputs will be disabled
*/
isProvidedViaProps: boolean;
}
export const ProjectContext = createContext<Project | undefined>(undefined);
@@ -52,6 +52,7 @@ describe('testHelpers', () => {
},
"mockBumpedTag": "rc-2020.01.01_1337",
"mockCalverProject": Object {
"isProvidedViaProps": false,
"owner": "mock_owner",
"repo": "mock_repo",
"versioningStrategy": "calver",
@@ -112,6 +113,7 @@ describe('testHelpers', () => {
"sha": "mock_sha_selected_patch_commit",
},
"mockSemverProject": Object {
"isProvidedViaProps": false,
"owner": "mock_owner",
"repo": "mock_repo",
"versioningStrategy": "semver",
@@ -31,12 +31,14 @@ export const mockSemverProject: Project = {
owner: mockOwner,
repo: mockRepo,
versioningStrategy: 'semver',
isProvidedViaProps: false,
};
export const mockCalverProject: Project = {
owner: mockOwner,
repo: mockRepo,
versioningStrategy: 'calver',
isProvidedViaProps: false,
};
export const mockSearchCalver = `?versioningStrategy=${mockCalverProject.versioningStrategy}&owner=${mockCalverProject.owner}&repo=${mockCalverProject.repo}`;
@@ -14,7 +14,7 @@
* limitations under the License.
*/
interface ComponentConfig<Args = void> {
export interface ComponentConfig<Args = void> {
successCb?: (args: Args) => Promise<void> | void;
omit?: boolean;
}