yujunjun/OpenMetadata
1
0
Fork 0
mirror of https://github.com/open-metadata/OpenMetadata.git synced 2025-10-17 03:38:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

UI : Remove tailwind css dependency from Policies and Rule Page (#9518)

Browse Source 
* Remove tailwind css dependicy from Roles and Basic signup form

* Remove tailwind css dependicy from Policies and Rule Page
This commit is contained in:
Ashish Gupta 2022-12-30 19:15:04 +05:30 committed by GitHub
parent 5de9658545
commit d7e4ec30ac
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
12 changed files with 49 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
openmetadata-ui/src/main/resources/ui/src/pages/AddServicePage/AddServicePage.component.tsx
View File

@ -185,7 +185,7 @@ const AddServicePage = () => {
return (
<PageContainerV1>
<div className="tw-self-center">
<div className="self-center">
<AddService
addIngestion={addIngestion}
handleAddIngestion={handleAddIngestion}

4
openmetadata-ui/src/main/resources/ui/src/pages/AlertsPage/AlertsPage.tsx
View File

@ -109,7 +109,7 @@ const AlertsPage = () => {
<Link to={`edit-alert/${id}`}>
<Button
data-testid={`alert-edit-${record.name}`}
icon={<SVGIcons className="tw-w-4" icon={Icons.EDIT} />}
icon={<SVGIcons className="w-4" icon={Icons.EDIT} />}
type="text"
/>
</Link>
@ -118,7 +118,7 @@ const AlertsPage = () => {
<Button
data-testid={`alert-delete-${record.name}`}
disabled={record.provider === ProviderType.System}
icon={<SVGIcons className="tw-w-4" icon={Icons.DELETE} />}
icon={<SVGIcons className="w-4" icon={Icons.DELETE} />}
type="text"
onClick={() => setSelectedAlert(record)}
/>

6
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/AddRulePage.tsx
View File

@ -112,12 +112,12 @@ const AddRulePage = () => {
}
return (
<Row className="tw-bg-body-main tw-h-auto p-y-lg" gutter={[16, 16]}>
<Row className="bg-body-main h-auto p-y-lg" gutter={[16, 16]}>
<Col offset={5} span={14}>
<TitleBreadcrumb className="m-b-md" titleLinks={breadcrumb} />
<Card>
<Typography.Paragraph
className="tw-text-base"
className="text-base"
data-testid="add-rule-title">
Add New Rule
</Typography.Paragraph>
@ -130,7 +130,7 @@ const AddRulePage = () => {
layout="vertical"
onFinish={handleSubmit}>
<RuleForm ruleData={ruleData} setRuleData={setRuleData} />
<Space align="center" className="tw-w-full tw-justify-end">
<Space align="center" className="w-full justify-end">
<Button data-testid="cancel-btn" type="link" onClick={handleBack}>
Cancel
</Button>

6
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/EditRulePage.tsx
View File

@ -133,12 +133,12 @@ const EditRulePage = () => {
}
return (
<Row className="tw-bg-body-main tw-h-auto p-y-lg" gutter={[16, 16]}>
<Row className="bg-body-main h-auto p-y-lg" gutter={[16, 16]}>
<Col offset={5} span={14}>
<TitleBreadcrumb className="m-b-md" titleLinks={breadcrumb} />
<Card>
<Typography.Paragraph
className="tw-text-base"
className="text-base"
data-testid="edit-rule-title">
Edit Rule {`"${ruleName}"`}
</Typography.Paragraph>
@ -155,7 +155,7 @@ const EditRulePage = () => {
layout="vertical"
onFinish={handleSubmit}>
<RuleForm ruleData={ruleData} setRuleData={setRuleData} />
<Space align="center" className="tw-w-full tw-justify-end">
<Space align="center" className="w-full justify-end">
<Button data-testid="cancel-btn" type="link" onClick={handleBack}>
Cancel
</Button>

39
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailPage.tsx
View File

@ -261,7 +261,7 @@ const PoliciesDetailPage = () => {
{
label: (
<Button
className="tw-p-0"
className="p-0"
data-testid="edit-rule"
type="text"
onClick={(e) => {
@ -285,7 +285,7 @@ const PoliciesDetailPage = () => {
{
label: (
<Button
className="tw-p-0"
className="p-0"
data-testid="delete-rule"
type="text"
onClick={(e) => {
@ -324,7 +324,7 @@ const PoliciesDetailPage = () => {
e.stopPropagation();
}}>
<FontAwesomeIcon
className="tw-text-grey-body"
className="text-grey-body"
icon="ellipsis-vertical"
/>
</Button>
@ -390,7 +390,7 @@ const PoliciesDetailPage = () => {
</ErrorPlaceHolder>
) : (
<Space
className="tw-w-full tabpane-space"
className="w-full tabpane-space"
direction="vertical">
<Tooltip
title={
@ -409,20 +409,17 @@ const PoliciesDetailPage = () => {
</Button>
</Tooltip>
<Space
className="tw-w-full"
direction="vertical"
size={20}>
<Space className="w-full" direction="vertical" size={20}>
{policy.rules.map((rule) => (
<Card
data-testid="rule-card"
key={rule.name || 'rule'}>
<Space
align="baseline"
className="tw-w-full tw-justify-between tw-pb-5"
className="w-full justify-between p-b-lg"
direction="horizontal">
<Typography.Text
className="tw-font-medium tw-text-base tw-text-grey-body"
className="font-medium text-base text-grey-body"
data-testid="rule-name">
{rule.name}
</Typography.Text>
@ -430,13 +427,13 @@ const PoliciesDetailPage = () => {
</Space>
<Space
className="tw-w-full"
className="w-full"
direction="vertical"
size={12}>
{rule.description && (
<Row data-testid="description">
<Col span={2}>
<Typography.Text className="tw-text-grey-muted">
<Typography.Text className="text-grey-muted">
{t('label.description')} :
</Typography.Text>
</Col>
@ -450,12 +447,12 @@ const PoliciesDetailPage = () => {
<Row data-testid="resources">
<Col span={2}>
<Typography.Text className="tw-text-grey-muted tw-mb-0">
{t('label.resource-plural')} :
<Typography.Text className="text-grey-muted m-b-0">
{t('label.resources')} :
</Typography.Text>
</Col>
<Col span={22}>
<Typography.Text className="tw-text-grey-body">
<Typography.Text className="text-grey-body">
{rule.resources
?.map((resource) => startCase(resource))
?.join(', ')}
@ -465,24 +462,24 @@ const PoliciesDetailPage = () => {
<Row data-testid="operations">
<Col span={2}>
<Typography.Text className="tw-text-grey-muted">
{t('label.operation-plural')} :
<Typography.Text className="text-grey-muted">
{t('label.operations')} :
</Typography.Text>
</Col>
<Col span={22}>
<Typography.Text className="tw-text-grey-body">
<Typography.Text className="text-grey-body">
{rule.operations?.join(', ')}
</Typography.Text>
</Col>
</Row>
<Row data-testid="effect">
<Col span={2}>
<Typography.Text className="tw-text-grey-muted">
<Typography.Text className="text-grey-muted">
{t('label.effect')} :
</Typography.Text>
</Col>
<Col span={22}>
<Typography.Text className="tw-text-grey-body">
<Typography.Text className="text-grey-body">
{startCase(rule.effect)}
</Typography.Text>
</Col>
@ -490,7 +487,7 @@ const PoliciesDetailPage = () => {
{rule.condition && (
<Row data-testid="condition">
<Col span={2}>
<Typography.Text className="tw-text-grey-muted">
<Typography.Text className="text-grey-muted">
{t('label.condition')} :
</Typography.Text>
</Col>

2
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesDetailPage/PoliciesDetailsList.component.tsx
View File

@ -61,7 +61,7 @@ const PoliciesDetailsList = ({
}
return (
<Link className="hover:tw-underline tw-cursor-pointer" to={link}>
<Link className="link-hover" to={link}>
{getEntityName(record)}
</Link>
);

8
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/PoliciesListPage/PoliciesList.tsx
View File

@ -72,7 +72,7 @@ const PoliciesList: FC<PolicyListProps> = ({ policies, fetchPolicies }) => {
key: 'name',
render: (_, record) => (
<Link
className="hover:tw-underline tw-cursor-pointer"
className="link-hover"
data-testid="policy-name"
to={getPolicyWithFqnPath(record.fullyQualifiedName || '')}>
{getEntityName(record)}
@ -113,7 +113,7 @@ const PoliciesList: FC<PolicyListProps> = ({ policies, fetchPolicies }) => {
)}
{hasMore && (
<Popover
className="tw-cursor-pointer"
className="cursor-pointer"
content={
<Space wrap size={4}>
{record.roles.slice(LIST_CAP).map((role) =>
@ -135,9 +135,9 @@ const PoliciesList: FC<PolicyListProps> = ({ policies, fetchPolicies }) => {
)}
</Space>
}
overlayClassName="tw-w-40 tw-text-center"
overlayClassName="w-40 text-center"
trigger="click">
<Tag className="tw-ml-1" data-testid="plus-more-count">{`+${
<Tag className="m-l-xss" data-testid="plus-more-count">{`+${
listLength - LIST_CAP
} more`}</Tag>
</Popover>

10
openmetadata-ui/src/main/resources/ui/src/pages/PoliciesPage/RuleForm/RuleForm.tsx
View File

@ -250,7 +250,7 @@ const RuleForm: FC<RuleFormProps> = ({ ruleData, setRuleData }) => {
]}>
<TreeSelect
treeCheckable
className="tw-w-full"
className="w-full"
data-testid="resources"
placeholder={t('label.select-resource-plural')}
showCheckedStrategy={TreeSelect.SHOW_PARENT}
@ -276,7 +276,7 @@ const RuleForm: FC<RuleFormProps> = ({ ruleData, setRuleData }) => {
]}>
<TreeSelect
treeCheckable
className="tw-w-full"
className="w-full"
data-testid="operations"
placeholder="Select Operations"
showCheckedStrategy={TreeSelect.SHOW_PARENT}
@ -324,18 +324,18 @@ const RuleForm: FC<RuleFormProps> = ({ ruleData, setRuleData }) => {
onSearch={handleConditionSearch}
/>
{validationError && (
<div className="tw-mt-1" data-testid="condition-error" role="alert">
<div className="m-t-xss" data-testid="condition-error" role="alert">
{`❌ Invalid condition : ${validationError}`}
</div>
)}
{isValidatingCondition && (
<div className="tw-mt-1" role="alert">
<div className="m-t-xss" role="alert">
Validating the condition...
</div>
)}
{isValidCondition && !isValidatingCondition && !validationError && (
<div
className="tw-mt-1"
className="m-t-xss"
data-testid="condition-success"
role="alert">
✅ Valid condition

4
openmetadata-ui/src/main/resources/ui/src/pages/ProfilerDashboardPage/ProfilerDashboardPage.tsx
View File

@ -213,7 +213,7 @@ const ProfilerDashboardPage = () => {
if (error) {
return (
<ErrorPlaceHolder>
<p className="tw-text-center">
<p className="text-center">
No data found{' '}
{decodedEntityFQN
? `for column ${getNameFromFQN(decodedEntityFQN)}`
@ -224,7 +224,7 @@ const ProfilerDashboardPage = () => {
}
return (
<PageContainerV1 className="tw-py-4">
<PageContainerV1 className="p-y-md">
<ProfilerDashboard
fetchProfilerData={fetchProfilerData}
fetchTestCases={fetchTestCases}

4
openmetadata-ui/src/main/resources/ui/src/pages/RolesPage/AddAttributeModal/AddAttributeModal.tsx
View File

@ -132,7 +132,7 @@ const AddAttributeModal: FC<Props> = ({
title={
<span data-testid="modal-title">
{title}{' '}
<span className="tw-text-grey-muted tw-text-sm">
<span className="text-grey-muted text-sm">
({selectedValues.length}/{data.length} selected)
</span>
</span>
@ -175,7 +175,7 @@ const AddAttributeModal: FC<Props> = ({
</Col>
<Col span={2}>
{selectedValues.includes(option.id) && (
<FontAwesomeIcon className="tw-text-primary" icon="check" />
<FontAwesomeIcon className="text-primary" icon="check" />
)}
</Col>
</Row>

4
openmetadata-ui/src/main/resources/ui/src/pages/reset-password/reset-password.component.tsx
View File

@ -72,7 +72,7 @@ const ResetPassword = () => {
const handleReVerify = () => history.push(ROUTES.FORGOT_PASSWORD);
return (
<div className="h-full tw-py-36">
<div className="h-full p-y-36">
{tokenValid ? (
<Card
bodyStyle={{ padding: '48px' }}
@ -104,7 +104,7 @@ const ResetPassword = () => {
</Col>
<Col className="mt-12 text-center" span={24}>
<Typography.Text className="tw-text-xl font-medium tw-text-grey-muted">
<Typography.Text className="text-xl font-medium text-grey-muted">
Reset your Password
</Typography.Text>
</Col>

6
openmetadata-ui/src/main/resources/ui/src/styles/app.less
View File

@ -174,6 +174,12 @@
opacity: 0.6;
}
.link-hover {
&:hover {
text-decoration: underline;
cursor: pointer;
}
}
.cursor-pointer {
cursor: pointer;
}