From 26eb4295024464b279bfba9048417f68f39be7c3 Mon Sep 17 00:00:00 2001 From: Martin Hradil Date: Tue, 17 Oct 2023 22:07:33 +0000 Subject: [PATCH 1/2] AnsibleRole{,Namespace}{Detail,List} - rename for consistency No-Issue --- src/components/index.ts | 2 +- .../namespace-detail.tsx} | 16 ++++------ .../namespace-list.tsx} | 11 +++---- .../namespace.scss} | 0 .../role-detail.tsx} | 8 ++--- .../role-list.tsx} | 11 +++---- src/containers/index.ts | 8 ++--- src/index.d.ts | 2 +- src/loaders/standalone/routes.tsx | 30 +++++++++++-------- src/utilities/index.ts | 2 +- 10 files changed, 43 insertions(+), 47 deletions(-) rename src/containers/{legacy-namespaces/legacy-namespace.tsx => ansible-role/namespace-detail.tsx} (96%) rename src/containers/{legacy-namespaces/legacy-namespaces.tsx => ansible-role/namespace-list.tsx} (96%) rename src/containers/{legacy-namespaces/legacy-namespace.scss => ansible-role/namespace.scss} (100%) rename src/containers/{legacy-roles/legacy-role.tsx => ansible-role/role-detail.tsx} (98%) rename src/containers/{legacy-roles/legacy-roles.tsx => ansible-role/role-list.tsx} (95%) diff --git a/src/components/index.ts b/src/components/index.ts index 82f0b62dbe..f009bd51db 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -92,13 +92,13 @@ export { PermissionChipSelector } from './rbac/permission-chip-selector'; export { PreviewRoles } from './rbac/preview-roles'; export { RoleForm } from './rbac/role-form'; export { RoleHeader } from './rbac/role-header'; -export { RolePermissions } from './rbac/role-permissions'; export { CheckboxRow, ExpandableRow, RadioRow, RoleListTable, } from './rbac/role-list-table'; +export { RolePermissions } from './rbac/role-permissions'; export { SelectGroup } from './rbac/select-group'; export { SelectRoles } from './rbac/select-roles'; export { SelectUser } from './rbac/select-user'; diff --git a/src/containers/legacy-namespaces/legacy-namespace.tsx b/src/containers/ansible-role/namespace-detail.tsx similarity index 96% rename from src/containers/legacy-namespaces/legacy-namespace.tsx rename to src/containers/ansible-role/namespace-detail.tsx index d82ce2135e..ec31d43069 100644 --- a/src/containers/legacy-namespaces/legacy-namespace.tsx +++ b/src/containers/ansible-role/namespace-detail.tsx @@ -32,14 +32,13 @@ import { import { AppContext } from 'src/loaders/app-context'; import { Paths, formatPath } from 'src/paths'; import { RouteProps, getProviderInfo, withRouter } from 'src/utilities'; -import './legacy-namespace.scss'; +import './namespace.scss'; interface LegacyNamespaceRolesProps { namespace: LegacyNamespaceListType; } interface LegacyNamespaceRolesState { - mounted: boolean; loading: boolean; count: number; namespace: LegacyNamespaceListType; @@ -64,7 +63,6 @@ class LegacyNamespaceRoles extends React.Component< constructor(props) { super(props); this.state = { - mounted: false, loading: true, count: 0, namespace: props.namespace, @@ -92,7 +90,6 @@ class LegacyNamespaceRoles extends React.Component< github_user: namespace.name, }).then((response) => { this.setState(() => ({ - mounted: true, loading: false, params: { page: page, @@ -117,7 +114,6 @@ class LegacyNamespaceRoles extends React.Component< github_user: namespace.name, }).then((response) => { this.setState(() => ({ - mounted: true, loading: false, params: { page: page, @@ -188,10 +184,12 @@ interface LegacyNamespaceProps { alerts: AlertType[]; } -class LegacyNamespace extends React.Component< +class AnsibleRoleNamespaceDetail extends React.Component< RouteProps, LegacyNamespaceProps > { + static contextType = AppContext; + // This is the details page for a legacy namespace constructor(props) { @@ -313,7 +311,7 @@ class LegacyNamespace extends React.Component< aria-label={t`Role namespace header`} className='hub-legacy-namespace-page' > - + @@ -326,6 +324,4 @@ class LegacyNamespace extends React.Component< } } -export default withRouter(LegacyNamespace); - -LegacyNamespace.contextType = AppContext; +export default withRouter(AnsibleRoleNamespaceDetail); diff --git a/src/containers/legacy-namespaces/legacy-namespaces.tsx b/src/containers/ansible-role/namespace-list.tsx similarity index 96% rename from src/containers/legacy-namespaces/legacy-namespaces.tsx rename to src/containers/ansible-role/namespace-list.tsx index f87bd063fb..1d684fa518 100644 --- a/src/containers/legacy-namespaces/legacy-namespaces.tsx +++ b/src/containers/ansible-role/namespace-list.tsx @@ -20,7 +20,6 @@ import { RouteProps, withRouter } from 'src/utilities'; interface LegacyNamespacesProps { legacynamespaces: LegacyNamespaceListType[]; loading: boolean; - mounted: boolean; count: number; params: { page?: number; @@ -35,10 +34,12 @@ interface LegacyNamespacesProps { alerts: AlertType[]; } -class LegacyNamespaces extends React.Component< +class AnsibleRoleNamespaceList extends React.Component< RouteProps, LegacyNamespacesProps > { + static contextType = AppContext; + constructor(props) { super(props); this.state = { @@ -50,7 +51,6 @@ class LegacyNamespaces extends React.Component< keywords: null, }, loading: true, - mounted: false, count: 0, legacynamespaces: [], isOpenWisdomModal: false, @@ -80,7 +80,6 @@ class LegacyNamespaces extends React.Component< keywords: keywords, }).then((response) => { this.setState(() => ({ - mounted: true, loading: false, params: { page: page, @@ -197,6 +196,4 @@ class LegacyNamespaces extends React.Component< } } -export default withRouter(LegacyNamespaces); - -LegacyNamespaces.contextType = AppContext; +export default withRouter(AnsibleRoleNamespaceList); diff --git a/src/containers/legacy-namespaces/legacy-namespace.scss b/src/containers/ansible-role/namespace.scss similarity index 100% rename from src/containers/legacy-namespaces/legacy-namespace.scss rename to src/containers/ansible-role/namespace.scss diff --git a/src/containers/legacy-roles/legacy-role.tsx b/src/containers/ansible-role/role-detail.tsx similarity index 98% rename from src/containers/legacy-roles/legacy-role.tsx rename to src/containers/ansible-role/role-detail.tsx index 56b170d6fd..4cdcff2981 100644 --- a/src/containers/legacy-roles/legacy-role.tsx +++ b/src/containers/ansible-role/role-detail.tsx @@ -186,7 +186,9 @@ interface IProps { activeItem: string; } -class LegacyRole extends React.Component { +class AnsibleRoleDetail extends React.Component { + static contextType = AppContext; + constructor(props) { super(props); const roleUser = props.routeParams.username; @@ -416,6 +418,4 @@ class LegacyRole extends React.Component { } } -export default withRouter(LegacyRole); - -LegacyRole.contextType = AppContext; +export default withRouter(AnsibleRoleDetail); diff --git a/src/containers/legacy-roles/legacy-roles.tsx b/src/containers/ansible-role/role-list.tsx similarity index 95% rename from src/containers/legacy-roles/legacy-roles.tsx rename to src/containers/ansible-role/role-list.tsx index 75af3189f9..7fe13b949f 100644 --- a/src/containers/legacy-roles/legacy-roles.tsx +++ b/src/containers/ansible-role/role-list.tsx @@ -15,7 +15,6 @@ import { RouteProps, withRouter } from 'src/utilities'; interface IProps { legacyroles: LegacyRoleListType[]; - mounted: boolean; loading: boolean; count: number; params: { @@ -30,7 +29,9 @@ interface IProps { ignoredParams: string[]; } -class LegacyRoles extends React.Component { +class AnsibleRoleList extends React.Component { + static contextType = AppContext; + // This is the main roles page constructor(props) { @@ -44,7 +45,6 @@ class LegacyRoles extends React.Component { keywords: null, }, loading: true, - mounted: false, count: 0, legacyroles: [], }; @@ -73,7 +73,6 @@ class LegacyRoles extends React.Component { keywords: keywords, }).then((response) => { this.setState(() => ({ - mounted: true, loading: false, params: { page: page, @@ -170,6 +169,4 @@ class LegacyRoles extends React.Component { } } -export default withRouter(LegacyRoles); - -LegacyRoles.contextType = AppContext; +export default withRouter(AnsibleRoleList); diff --git a/src/containers/index.ts b/src/containers/index.ts index bb5f3d99b4..6cf0d9e0fe 100644 --- a/src/containers/index.ts +++ b/src/containers/index.ts @@ -4,6 +4,10 @@ export { default as AnsibleRemoteList } from './ansible-remote/list'; export { default as AnsibleRepositoryDetail } from './ansible-repository/detail'; export { default as AnsibleRepositoryEdit } from './ansible-repository/edit'; export { default as AnsibleRepositoryList } from './ansible-repository/list'; +export { default as AnsibleRoleNamespaceDetail } from './ansible-role/namespace-detail'; +export { default as AnsibleRoleNamespaceList } from './ansible-role/namespace-list'; +export { default as AnsibleRoleDetail } from './ansible-role/role-detail'; +export { default as AnsibleRoleList } from './ansible-role/role-list'; export { default as CertificationDashboard } from './certification-dashboard/certification-dashboard'; export { default as CollectionContent } from './collection-detail/collection-content'; export { default as CollectionDependencies } from './collection-detail/collection-dependencies'; @@ -22,10 +26,6 @@ export { default as ExecutionEnvironmentRegistryList } from './execution-environ export { default as GroupDetail } from './group-management/group-detail'; export { default as GroupList } from './group-management/group-list'; export { default as LandingPage } from './landing/landing-page'; -export { default as LegacyNamespace } from './legacy-namespaces/legacy-namespace'; -export { default as LegacyNamespaces } from './legacy-namespaces/legacy-namespaces'; -export { default as LegacyRole } from './legacy-roles/legacy-role'; -export { default as LegacyRoles } from './legacy-roles/legacy-roles'; export { default as LoginPage } from './login/login'; export { default as MyImports } from './my-imports/my-imports'; export { default as NamespaceDetail } from './namespace-detail/namespace-detail'; diff --git a/src/index.d.ts b/src/index.d.ts index 8908a816d9..df7c62bdd6 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -13,8 +13,8 @@ declare var NAMESPACE_TERM; declare var PULP_API_BASE_PATH; declare var UI_BASE_PATH; declare var UI_COMMIT_HASH; -declare var UI_EXTERNAL_LOGIN_URI; declare var UI_DOCS_URL; +declare var UI_EXTERNAL_LOGIN_URI; // when DEPLOYMENT_MODE === Constants.INSIGHTS_DEPLOYMENT_MODE only interface Window { diff --git a/src/loaders/standalone/routes.tsx b/src/loaders/standalone/routes.tsx index c884373095..7b506e2eb5 100644 --- a/src/loaders/standalone/routes.tsx +++ b/src/loaders/standalone/routes.tsx @@ -9,6 +9,10 @@ import { AnsibleRepositoryDetail, AnsibleRepositoryEdit, AnsibleRepositoryList, + AnsibleRoleDetail, + AnsibleRoleList, + AnsibleRoleNamespaceDetail, + AnsibleRoleNamespaceList, CertificationDashboard, CollectionContent, CollectionDependencies, @@ -30,10 +34,6 @@ import { GroupDetail, GroupList, LandingPage, - LegacyNamespace, - LegacyNamespaces, - LegacyRole, - LegacyRoles, LoginPage, MultiSearch, MyImports, @@ -212,15 +212,21 @@ export class StandaloneRoutes extends React.Component { }, // roles ... - { component: LegacyNamespace, path: Paths.legacyNamespace }, - { component: LegacyNamespaces, path: Paths.legacyNamespaces }, - { component: LegacyRole, path: Paths.legacyRole }, - { component: LegacyRoles, path: Paths.legacyRoles }, + { component: AnsibleRoleNamespaceDetail, path: Paths.legacyNamespace }, + { component: AnsibleRoleNamespaceList, path: Paths.legacyNamespaces }, + { component: AnsibleRoleDetail, path: Paths.legacyRole }, + { component: AnsibleRoleList, path: Paths.legacyRoles }, // ... but still support legacy urls - { component: LegacyNamespace, path: Paths.compatLegacyNamespace }, - { component: LegacyNamespaces, path: Paths.compatLegacyNamespaces }, - { component: LegacyRole, path: Paths.compatLegacyRole }, - { component: LegacyRoles, path: Paths.compatLegacyRoles }, + { + component: AnsibleRoleNamespaceDetail, + path: Paths.compatLegacyNamespace, + }, + { + component: AnsibleRoleNamespaceList, + path: Paths.compatLegacyNamespaces, + }, + { component: AnsibleRoleDetail, path: Paths.compatLegacyRole }, + { component: AnsibleRoleList, path: Paths.compatLegacyRoles }, { component: TaskListView, diff --git a/src/utilities/index.ts b/src/utilities/index.ts index 6eba9ec3ee..8d9a97e878 100644 --- a/src/utilities/index.ts +++ b/src/utilities/index.ts @@ -10,6 +10,7 @@ export { getContainersURL, getRepoURL } from './get-repo-url'; export { getHumanSize } from './get_human_size'; export { hasPermission } from './has-permission'; export { lastSyncStatus, lastSynced } from './last-sync-task'; +export { getProviderInfo } from './legacy-namespace'; export { ErrorMessagesType, alertErrorsWithoutFields, @@ -36,4 +37,3 @@ export { isFieldSet, isWriteOnly, } from './write-only-fields'; -export { getProviderInfo } from './legacy-namespace'; From 73e8dbbc933bd3e4f199982791dc0cd09440f862 Mon Sep 17 00:00:00 2001 From: Martin Hradil Date: Tue, 17 Oct 2023 22:53:04 +0000 Subject: [PATCH 2/2] clean up props, state types; extra React.Fragment, context --- .../ansible-role/namespace-detail.tsx | 72 ++++++++--------- .../ansible-role/namespace-list.tsx | 81 +++++++++---------- src/containers/ansible-role/role-detail.tsx | 30 +++---- src/containers/ansible-role/role-list.tsx | 79 +++++++++--------- 4 files changed, 122 insertions(+), 140 deletions(-) diff --git a/src/containers/ansible-role/namespace-detail.tsx b/src/containers/ansible-role/namespace-detail.tsx index ec31d43069..95232d91ef 100644 --- a/src/containers/ansible-role/namespace-detail.tsx +++ b/src/containers/ansible-role/namespace-detail.tsx @@ -34,11 +34,11 @@ import { Paths, formatPath } from 'src/paths'; import { RouteProps, getProviderInfo, withRouter } from 'src/utilities'; import './namespace.scss'; -interface LegacyNamespaceRolesProps { +interface NamespaceRolesProps { namespace: LegacyNamespaceListType; } -interface LegacyNamespaceRolesState { +interface NamespaceRolesState { loading: boolean; count: number; namespace: LegacyNamespaceListType; @@ -53,9 +53,9 @@ interface LegacyNamespaceRolesState { }; } -class LegacyNamespaceRoles extends React.Component< - LegacyNamespaceRolesProps, - LegacyNamespaceRolesState +class NamespaceRoles extends React.Component< + NamespaceRolesProps, + NamespaceRolesState > { // This is the list of roles that is shown on // the legacy namespace details page. @@ -133,40 +133,38 @@ class LegacyNamespaceRoles extends React.Component< return (
- - {loading ? ( - - ) : noData ? ( - - ) : ( -
- - {this.state.roles.map((lrole, ix) => ( - - ))} - + {loading ? ( + + ) : noData ? ( + + ) : ( +
+ + {this.state.roles.map((lrole, ix) => ( + + ))} + - -
- )} - + +
+ )}
); } } -interface LegacyNamespaceProps { +interface RoleNamespaceState { loading: boolean; namespaceid: number; namespace: LegacyNamespaceListType; @@ -186,7 +184,7 @@ interface LegacyNamespaceProps { class AnsibleRoleNamespaceDetail extends React.Component< RouteProps, - LegacyNamespaceProps + RoleNamespaceState > { static contextType = AppContext; @@ -294,7 +292,7 @@ class AnsibleRoleNamespaceDetail extends React.Component< } return ( - + <> {this.state.isOpenWisdomModal && ( this.addAlert(alert)} @@ -318,8 +316,8 @@ class AnsibleRoleNamespaceDetail extends React.Component< - - + + ); } } diff --git a/src/containers/ansible-role/namespace-list.tsx b/src/containers/ansible-role/namespace-list.tsx index 1d684fa518..8b4d7785fd 100644 --- a/src/containers/ansible-role/namespace-list.tsx +++ b/src/containers/ansible-role/namespace-list.tsx @@ -14,10 +14,9 @@ import { WisdomModal, closeAlertMixin, } from 'src/components'; -import { AppContext } from 'src/loaders/app-context'; import { RouteProps, withRouter } from 'src/utilities'; -interface LegacyNamespacesProps { +interface RoleNamespacesState { legacynamespaces: LegacyNamespaceListType[]; loading: boolean; count: number; @@ -36,10 +35,8 @@ interface LegacyNamespacesProps { class AnsibleRoleNamespaceList extends React.Component< RouteProps, - LegacyNamespacesProps + RoleNamespacesState > { - static contextType = AppContext; - constructor(props) { super(props); this.state = { @@ -150,47 +147,45 @@ class AnsibleRoleNamespaceList extends React.Component< /> )} - - {loading ? ( - - ) : noData ? ( - + ) : noData ? ( + + ) : ( +
+ - ) : ( -
- - - - - {this.state.legacynamespaces && - this.state.legacynamespaces.map((lnamespace) => ( - this.openModal(namespace)} - /> - ))} - + - -
- )} - + + {this.state.legacynamespaces && + this.state.legacynamespaces.map((lnamespace) => ( + this.openModal(namespace)} + /> + ))} + + + +
+ )} ); } diff --git a/src/containers/ansible-role/role-detail.tsx b/src/containers/ansible-role/role-detail.tsx index 4cdcff2981..ff83accb83 100644 --- a/src/containers/ansible-role/role-detail.tsx +++ b/src/containers/ansible-role/role-detail.tsx @@ -34,7 +34,6 @@ import { RoleRatings, Tag, } from 'src/components'; -import { AppContext } from 'src/loaders/app-context'; import { Paths, formatPath } from 'src/paths'; import { RouteProps, chipGroupProps, withRouter } from 'src/utilities'; @@ -49,7 +48,7 @@ interface RoleMetaReadme { readme_html: string; } -class LegacyRoleInstall extends React.Component { +class RoleInstall extends React.Component { render() { const installCMD = `ansible-galaxy role install ${this.props.github_user}.${this.props.name}`; return ( @@ -65,7 +64,7 @@ class LegacyRoleInstall extends React.Component { } } -class LegacyRoleDocs extends React.Component { +class RoleDocs extends React.Component { constructor(props) { super(props); this.state = { @@ -94,14 +93,11 @@ class LegacyRoleDocs extends React.Component { } } -interface RoleVersionIProps { +interface RoleVersionProps { role_version: LegacyRoleVersionDetailType; } -class LegacyRoleVersion extends React.Component< - RoleVersionIProps, - RoleVersionIProps -> { +class RoleVersion extends React.Component { render() { return ( @@ -128,12 +124,12 @@ class LegacyRoleVersion extends React.Component< } } -interface RoleVersionsIProps { +interface RoleVersionsState { role_versions: LegacyRoleVersionDetailType[]; loading: boolean; } -class LegacyRoleVersions extends React.Component { +class RoleVersions extends React.Component { constructor(props) { super(props); this.state = { @@ -169,7 +165,7 @@ class LegacyRoleVersions extends React.Component { {this.state.role_versions.reverse().map((rversion) => ( - + ))} @@ -178,7 +174,7 @@ class LegacyRoleVersions extends React.Component { } } -interface IProps { +interface RoleState { role: LegacyRoleDetailType; github_user: string; name: string; @@ -186,9 +182,7 @@ interface IProps { activeItem: string; } -class AnsibleRoleDetail extends React.Component { - static contextType = AppContext; - +class AnsibleRoleDetail extends React.Component { constructor(props) { super(props); const roleUser = props.routeParams.username; @@ -328,7 +322,7 @@ class AnsibleRoleDetail extends React.Component { const renderContent = () => { if (this.state.activeItem == 'install') { return ( - { ); } else if (this.state.activeItem === 'documentation') { return ( - { ); } else if (this.state.activeItem === 'versions') { return ( - { - static contextType = AppContext; - +class AnsibleRoleList extends React.Component { // This is the main roles page constructor(props) { @@ -123,47 +120,45 @@ class AnsibleRoleList extends React.Component { return (
- - {loading ? ( - - ) : noData ? ( - + ) : noData ? ( + + ) : ( +
+ - ) : ( -
- - + - - {this.state.legacyroles && - this.state.legacyroles.map((lrole) => ( - - ))} - + + {this.state.legacyroles && + this.state.legacyroles.map((lrole) => ( + + ))} + - -
- )} - + +
+ )}
); }