Skip to content

Commit 19e6962

Browse files
logonofflogonoff
committed
ODC-6775: import * as cx -> import classnames 
1 parent a1e1c59 commit 19e6962

File tree

33 files changed

+108
-90
lines changed

33 files changed

+108
-90
lines changed

‎frontend/packages/console-plugin-shared/src/components/Markdown/MarkdownView.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/* eslint-disable @typescript-eslint/no-use-before-define */
22
import * as React from 'react';
3-
import * as cx from 'classnames';
3+
import classNames from 'classnames';
44
import * as _ from 'lodash';
55
import * as sanitizeHtml from 'sanitize-html';
66
import { Converter, ShowdownOptions, ShowdownExtension } from 'showdown';
@@ -168,7 +168,7 @@ const InlineMarkdownView: React.FC<InnerSyncMarkdownProps> = ({
168168
}) => {
169169
const id = React.useMemo(() => _.uniqueId('markdown'), []);
170170
return (
171-
<div className={cx('co-markdown-view', { 'is-empty': isEmpty })} id={id}>
171+
<div className={classNames('co-markdown-view', { 'is-empty': isEmpty })} id={id}>
172172
{/* eslint-disable-next-line react/no-danger */}
173173
<div dangerouslySetInnerHTML={{ __html: markup }} />
174174
<RenderExtension renderExtension={renderExtension} selector={`#${id}`} markup={markup} />

‎frontend/packages/console-shared/src/components/catalog/catalog-view/CatalogCategories.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { VerticalTabs, VerticalTabsTab } from '@patternfly/react-catalog-view-extension';
3-
import * as cx from 'classnames';
3+
import classNames from 'classnames';
44
import * as _ from 'lodash';
55
import { Link } from 'react-router-dom-v5-compat';
66
import { isModifiedEvent } from '@console/shared/src/utils';
@@ -33,7 +33,7 @@ const CatalogCategories: React.FC<CatalogCategoriesProp> = ({
3333
const { id, label, subcategories, numItems } = category;
3434
const active = id === selectedCategory;
3535

36-
const tabClasses = cx('text-capitalize', { 'co-catalog-tab__empty': !numItems });
36+
const tabClasses = classNames('text-capitalize', { 'co-catalog-tab__empty': !numItems });
3737

3838
return (
3939
<VerticalTabsTab

‎frontend/packages/console-shared/src/components/form-utils/FormFooter.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import * as React from 'react';
22
import { ActionGroup, Alert, Button, ButtonVariant } from '@patternfly/react-core';
33
import { DownloadIcon } from '@patternfly/react-icons/dist/esm/icons/download-icon';
4-
import * as cx from 'classnames';
4+
import classNames from 'classnames';
55
import { useTranslation } from 'react-i18next';
66
import { ButtonBar } from '@console/internal/components/utils';
77
import { Shadows, useScrollShadows, useScrollContainer } from '../../hooks';
@@ -32,7 +32,7 @@ const FormFooter: React.FC<FormFooterProps> = ({
3232
const shadowPosition = useScrollShadows(sticky ? scrollContainer : null);
3333
return (
3434
<div
35-
className={cx('ocs-form-footer', {
35+
className={classNames('ocs-form-footer', {
3636
'ocs-form-footer__sticky': sticky,
3737
'ocs-form-footer__shadow':
3838
sticky && (shadowPosition === Shadows.both || shadowPosition === Shadows.bottom),

‎frontend/packages/console-shared/src/components/formik-fields/DropdownField.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { FormGroup, FormHelperText, HelperText, HelperTextItem } from '@patternfly/react-core';
3-
import cx from 'classnames';
3+
import classNames from 'classnames';
44
import { useField, useFormikContext, FormikValues } from 'formik';
55
import { Dropdown } from '@console/internal/components/utils';
66
import { useFormikValidationFix } from '../../hooks';
@@ -23,7 +23,7 @@ const DropdownField: React.FC<DropdownFieldProps> = ({ label, helpText, required
2323
{...props}
2424
id={fieldId}
2525
selectedKey={field.value}
26-
dropDownClassName={cx({ 'dropdown--full-width': props.fullWidth })}
26+
dropDownClassName={classNames({ 'dropdown--full-width': props.fullWidth })}
2727
aria-describedby={helpText ? `${fieldId}-helper` : undefined}
2828
onChange={(value: string) => {
2929
props.onChange && props.onChange(value);

‎frontend/packages/console-shared/src/components/formik-fields/DynamicFormField.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { FormProps } from '@rjsf/core';
3-
import cx from 'classnames';
3+
import classNames from 'classnames';
44
import { useField, useFormikContext, FormikValues } from 'formik';
55
import { AsyncComponent } from '@console/internal/components/utils';
66

@@ -24,16 +24,16 @@ const DynamicFormField: React.FC<DynamicFormFieldProps> = ({
2424
const { setFieldValue } = useFormikContext<FormikValues>();
2525

2626
return (
27-
<div className={cx({ row: formDescription })}>
27+
<div className={classNames({ row: formDescription })}>
2828
<div
29-
className={cx({
29+
className={classNames({
3030
'col-sm-12 col-md-4 col-md-push-8 col-lg-5 col-lg-push-7': formDescription,
3131
})}
3232
>
3333
{formDescription}
3434
</div>
3535
<div
36-
className={cx({
36+
className={classNames({
3737
'col-sm-12 col-md-8 col-md-pull-4 col-lg-7 col-lg-pull-5': formDescription,
3838
})}
3939
>

‎frontend/packages/console-shared/src/components/formik-fields/ResourceDropdownField.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { FormGroup, FormHelperText, HelperText, HelperTextItem } from '@patternfly/react-core';
3-
import cx from 'classnames';
3+
import classNames from 'classnames';
44
import { useField, useFormikContext, FormikValues } from 'formik';
55
import { Firehose, FirehoseResource } from '@console/internal/components/utils';
66
import { K8sResourceKind } from '@console/internal/module/k8s';
@@ -57,7 +57,7 @@ const ResourceDropdownField: React.FC<ResourceDropdownFieldProps> = ({
5757
id={fieldId}
5858
dataSelector={dataSelector}
5959
selectedKey={field.value}
60-
dropDownClassName={cx({ 'dropdown--full-width': fullWidth })}
60+
dropDownClassName={classNames({ 'dropdown--full-width': fullWidth })}
6161
onLoad={onLoad}
6262
resourceFilter={resourceFilter}
6363
onChange={(value: string, name: string | object, resource: K8sResourceKind) => {

‎frontend/packages/console-shared/src/components/formik-fields/SyncedEditorField.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { Alert, Button, AlertActionCloseButton } from '@patternfly/react-core';
3-
import cx from 'classnames';
3+
import classNames from 'classnames';
44
import { useField, useFormikContext, FormikValues } from 'formik';
55
import * as _ from 'lodash';
66
import { useTranslation } from 'react-i18next';
@@ -146,7 +146,7 @@ const SyncedEditorField: React.FC<SyncedEditorFieldProps> = ({
146146
return loaded ? (
147147
<>
148148
<div
149-
className={cx('ocs-synced-editor-field__editor-toggle', { margin: !noMargin })}
149+
className={classNames('ocs-synced-editor-field__editor-toggle', { margin: !noMargin })}
150150
data-test="synced-editor-field"
151151
>
152152
<RadioGroupField

‎frontend/packages/console-shared/src/components/modal/Modal.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { Modal as PfModal, ModalProps as PfModalProps } from '@patternfly/react-core/deprecated';
3-
import * as cx from 'classnames';
3+
import classNames from 'classnames';
44
import './Modal.scss';
55

66
type ModalProps = {
@@ -11,7 +11,7 @@ type ModalProps = {
1111
const Modal: React.FC<ModalProps> = ({ isFullScreen = false, className, ...props }) => (
1212
<PfModal
1313
{...props}
14-
className={cx('ocs-modal', className)}
14+
className={classNames('ocs-modal', className)}
1515
appendTo={() => (isFullScreen ? document.body : document.querySelector('#modal-container'))}
1616
/>
1717
);

‎frontend/packages/console-shared/src/components/namespace/NamespaceMenuToggle.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { MenuToggle, Popper } from '@patternfly/react-core';
3-
import * as cx from 'classnames';
3+
import classNames from 'classnames';
44

55
const NamespaceMenuToggle = (props: {
66
disabled: boolean;
@@ -72,7 +72,7 @@ const NamespaceMenuToggle = (props: {
7272
onClick={() => onToggle(!isOpen)}
7373
isExpanded={isOpen}
7474
disabled={disabled}
75-
className={cx('co-namespace-dropdown__menu-toggle', className)}
75+
className={classNames('co-namespace-dropdown__menu-toggle', className)}
7676
>
7777
{title}
7878
</MenuToggle>

‎frontend/packages/console-shared/src/components/quick-search/QuickSearchContent.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { Split, SplitItem, Divider } from '@patternfly/react-core';
3-
import cx from 'classnames';
3+
import classNames from 'classnames';
44
import { CatalogItem } from '@console/dynamic-plugin-sdk';
55
import { CatalogType } from '../catalog';
66
import QuickSearchDetails, { DetailsRendererFunction } from './QuickSearchDetails';
@@ -40,7 +40,7 @@ const QuickSearchContent: React.FC<QuickSearchContentProps> = ({
4040
return (
4141
<Split className="ocs-quick-search-content" tabIndex={-1}>
4242
<SplitItem
43-
className={cx('ocs-quick-search-content__list pf-v6-u-pt-xs', {
43+
className={classNames('ocs-quick-search-content__list pf-v6-u-pt-xs', {
4444
'ocs-quick-search-content__list--overflow': catalogItems.length >= limitItemCount,
4545
})}
4646
>

‎frontend/packages/console-shared/src/components/quick-search/QuickSearchList.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {
1111
Content,
1212
ContentVariants,
1313
} from '@patternfly/react-core';
14-
import cx from 'classnames';
14+
import classNames from 'classnames';
1515
import { useTranslation } from 'react-i18next';
1616
import { Link } from 'react-router-dom-v5-compat';
1717
import { CatalogItem } from '@console/dynamic-plugin-sdk';
@@ -103,7 +103,7 @@ const QuickSearchList: React.FC<QuickSearchListProps> = ({
103103
id={item.uid}
104104
key={item.uid}
105105
tabIndex={-1}
106-
className={cx('ocs-quick-search-list__item', {
106+
className={classNames('ocs-quick-search-list__item', {
107107
'ocs-quick-search-list__item--highlight': item.uid === selectedItemId,
108108
})}
109109
onDoubleClick={(e: React.SyntheticEvent) => {

‎frontend/packages/dev-console/src/components/NamespacedPage.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react';
2-
import * as cx from 'classnames';
2+
import classNames from 'classnames';
33
import { NamespaceBar } from '@console/internal/components/namespace-bar';
44
import NamespaceBarApplicationSelector from '@console/topology/src/components/dropdowns/NamespaceBarApplicationSelector';
55

@@ -38,7 +38,7 @@ const NamespacedPage: React.FC<NamespacedPageProps> = ({
3838
{toolbar && <div className="odc-namespaced-page__toolbar">{toolbar}</div>}
3939
</NamespaceBar>
4040
<div
41-
className={cx('odc-namespaced-page__content', {
41+
className={classNames('odc-namespaced-page__content', {
4242
[`is-${variant}`]: variant !== NamespacedPageVariants.default,
4343
})}
4444
>

‎frontend/packages/dev-console/src/components/add/AddPageLayout.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { Skeleton, Switch, Tooltip } from '@patternfly/react-core';
3-
import * as cx from 'classnames';
3+
import classNames from 'classnames';
44
import { useTranslation } from 'react-i18next';
55
import { AddActionGroup, isAddActionGroup } from '@console/dynamic-plugin-sdk';
66
import { GettingStartedSection } from '@console/internal/components/dashboard/project-dashboard/getting-started/GettingStartedSection';
@@ -66,7 +66,7 @@ const AddPageLayout: React.FC<AddPageLayoutProps> = ({ title, hintBlock: additio
6666
<ResourceQuotaAlert namespace={activeNamespace} />
6767
</div>
6868
<div
69-
className={cx('odc-add-page-layout__hint-block__details-switch', {
69+
className={classNames('odc-add-page-layout__hint-block__details-switch', {
7070
'odc-add-page-layout__hint-block__details-switch__loading-state': !extensionsLoaded,
7171
})}
7272
data-test="details-switch"

‎frontend/packages/dev-console/src/components/add/layout/Masonry.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react';
2-
import * as cx from 'classnames';
2+
import classNames from 'classnames';
33
import './MasonryLayout.scss';
44

55
type MasonryProps = {
@@ -64,7 +64,11 @@ export const Masonry: React.FC<MasonryProps> = ({ columnCount, children }) => {
6464
});
6565

6666
return (
67-
<div className={cx('odc-masonry-layout', { 'odc-masonry-layout__allRendered': allRendered })}>
67+
<div
68+
className={classNames('odc-masonry-layout', {
69+
'odc-masonry-layout__allRendered': allRendered,
70+
})}
71+
>
6872
{groupedColumns.map((groupedColumn, columnIndex) => (
6973
<div key={columnIndex.toString()} className="odc-masonry-layout__column">
7074
{groupedColumn.items}

‎frontend/packages/dev-console/src/components/import/section/FormSection.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { FormHelperText, Title } from '@patternfly/react-core';
3-
import cx from 'classnames';
3+
import classNames from 'classnames';
44
import './FormSection.scss';
55

66
export interface FormSectionProps {
@@ -32,7 +32,7 @@ const FormSection: React.FC<FormSectionProps> = ({
3232
style,
3333
}) => (
3434
<div
35-
className={cx('pf-v6-c-form', {
35+
className={classNames('pf-v6-c-form', {
3636
'co-m-pane__form': !fullWidth,
3737
'odc-form-section--extra-margin': extraMargin,
3838
})}

‎frontend/packages/knative-plugin/src/components/eventing/subscription-list/subscription-table.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
import * as cx from 'classnames';
1+
import classNames from 'classnames';
22
import { Kebab } from '@console/internal/components/utils';
33

44
export const tableColumnClasses = [
55
'', // name
66
'', // namespace
7-
cx('pf-m-hidden', 'pf-m-visible-on-sm'), // ready
8-
cx('pf-m-hidden', 'pf-m-visible-on-md'), // condition
9-
cx('pf-m-hidden', 'pf-m-visible-on-xl'), // channel
10-
cx('pf-m-hidden', 'pf-m-visible-on-xl'), // subscriber
11-
cx('pf-m-hidden', 'pf-m-visible-on-2xl'), // created
7+
classNames('pf-m-hidden', 'pf-m-visible-on-sm'), // ready
8+
classNames('pf-m-hidden', 'pf-m-visible-on-md'), // condition
9+
classNames('pf-m-hidden', 'pf-m-visible-on-xl'), // channel
10+
classNames('pf-m-hidden', 'pf-m-visible-on-xl'), // subscriber
11+
classNames('pf-m-hidden', 'pf-m-visible-on-2xl'), // created
1212
Kebab.columnClass, // kebab menu
1313
];

‎frontend/packages/knative-plugin/src/components/eventing/triggers-list/trigger-table.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
import * as cx from 'classnames';
1+
import classNames from 'classnames';
22
import { Kebab } from '@console/internal/components/utils';
33

44
export const tableColumnClasses = [
55
'', // name
66
'', // namespace
7-
cx('pf-m-hidden', 'pf-m-visible-on-xl'), // ready
8-
cx('pf-m-hidden', 'pf-m-visible-on-xl'), // condition
9-
cx('pf-m-hidden', 'pf-m-visible-on-sm'), // filters
7+
classNames('pf-m-hidden', 'pf-m-visible-on-xl'), // ready
8+
classNames('pf-m-hidden', 'pf-m-visible-on-xl'), // condition
9+
classNames('pf-m-hidden', 'pf-m-visible-on-sm'), // filters
1010
'', // broker
1111
'', // subscriber
12-
cx('pf-m-hidden', 'pf-m-visible-on-lg'), // created
12+
classNames('pf-m-hidden', 'pf-m-visible-on-lg'), // created
1313
Kebab.columnClass, // kebab menu
1414
];

‎frontend/packages/knative-plugin/src/components/functions/FunctionRow.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react';
2-
import * as cx from 'classnames';
2+
import classNames from 'classnames';
33
import { Link } from 'react-router-dom';
44
import { TableData, RowFunctionArgs } from '@console/internal/components/factory';
55
import {
@@ -36,10 +36,13 @@ const FunctionRow: React.FC<RowFunctionArgs<ServiceKind>> = ({ obj }) => {
3636
{obj.metadata.name}
3737
</Link>
3838
</TableData>
39-
<TableData className={cx(tableColumnClasses[1], 'co-break-word')} columnID="namespace">
39+
<TableData
40+
className={classNames(tableColumnClasses[1], 'co-break-word')}
41+
columnID="namespace"
42+
>
4043
<ResourceLink kind="Namespace" name={obj.metadata.namespace} />
4144
</TableData>
42-
<TableData className={cx(tableColumnClasses[2], 'co-break-word')}>
45+
<TableData className={classNames(tableColumnClasses[2], 'co-break-word')}>
4346
{(obj.status && obj.status.url && (
4447
<ExternalLink
4548
href={obj.status.url}

‎frontend/packages/knative-plugin/src/components/overview/FilterTable.tsx

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import { Table, Tr, Tbody, Td, Thead, Th } from '@patternfly/react-table';
3-
import cx from 'classnames';
3+
import classNames from 'classnames';
44
import { useTranslation } from 'react-i18next';
55
import './FilterTable.scss';
66

@@ -17,13 +17,13 @@ const FilterTable: React.FC<FilterTableProps> = ({
1717
paddingLeft = false,
1818
}) => {
1919
const filterRow = (key: string, value: string) => {
20-
const className = cx({ 'kn-filter-table__row--bordered': bordered });
20+
const className = classNames({ 'kn-filter-table__row--bordered': bordered });
2121
return {
2222
cells: [
2323
{
2424
title: key,
2525
props: {
26-
className: cx(className, { 'kn-filter-table__padding--left': paddingLeft }),
26+
className: classNames(className, { 'kn-filter-table__padding--left': paddingLeft }),
2727
},
2828
},
2929
{
@@ -51,8 +51,10 @@ const FilterTable: React.FC<FilterTableProps> = ({
5151
{data.columns.map((column) => (
5252
<Th
5353
key={column}
54-
className={cx(
55-
cx({ 'kn-filter-table__padding--left': paddingLeft && column === t('Attribute') }),
54+
className={classNames(
55+
classNames({
56+
'kn-filter-table__padding--left': paddingLeft && column === t('Attribute'),
57+
}),
5658
{ 'kn-filter-table__row--bordered': bordered },
5759
)}
5860
>

‎frontend/packages/knative-plugin/src/components/revisions/RevisionRow.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import * as React from 'react';
2-
import * as cx from 'classnames';
2+
import classNames from 'classnames';
33
import * as _ from 'lodash';
44
import { TableData, RowFunctionArgs } from '@console/internal/components/factory';
55
import { ResourceLink, Timestamp } from '@console/internal/components/utils';
@@ -29,10 +29,13 @@ const RevisionRow: React.FC<RowFunctionArgs<RevisionKind>> = ({ obj }) => {
2929
namespace={obj.metadata.namespace}
3030
/>
3131
</TableData>
32-
<TableData className={cx(tableColumnClasses[1], 'co-break-word')} columnID="namespace">
32+
<TableData
33+
className={classNames(tableColumnClasses[1], 'co-break-word')}
34+
columnID="namespace"
35+
>
3336
<ResourceLink kind="Namespace" name={obj.metadata.namespace} />
3437
</TableData>
35-
<TableData className={cx(tableColumnClasses[2], 'co-break-word')}>
38+
<TableData className={classNames(tableColumnClasses[2], 'co-break-word')}>
3639
{service && (
3740
<ResourceLink
3841
kind={serviceReference}

0 commit comments

Comments
 (0)