Skip to content

Commit f994583

Browse files
eshankvaisheshankvaish
authored
Merge pull request #171 from devtron-labs/feat/tenants-integration
feat: tenant integration
2 parents d2e9d79 + 462fc94 commit f994583

File tree

19 files changed

+336
-18
lines changed

19 files changed

+336
-18
lines changed

‎package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@devtron-labs/devtron-fe-common-lib",
3-
"version": "0.0.84-beta-6",
3+
"version": "0.0.84-beta-9",
44
"description": "Supporting common component library",
55
"type": "module",
66
"main": "dist/index.js",

‎src/Common/Dialogs/DeleteDialog.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ export const DeleteDialog: React.FC<DeleteDialogProps> & { Description?: React.F
3030
props.delete()
3131
}
3232

33-
const handleKeyDown = async (event: KeyboardEvent) => {
33+
const handleKeyDown = (event: KeyboardEvent) => {
3434
if (event.key === 'Enter' && !isDeleteDisabled) {
3535
event.preventDefault()
3636

‎src/Common/Hooks/useUrlFilters/useUrlFilters.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -73,9 +73,10 @@ const useUrlFilters = <T = string, K = unknown>({
7373
const _resetPageNumber = () => {
7474
if (pageNumber !== DEFAULT_PAGE_NUMBER) {
7575
_updateSearchParam(PAGE_NUMBER, DEFAULT_PAGE_NUMBER)
76-
} else {
77-
history.replace({ search: searchParams.toString() })
76+
return
7877
}
78+
79+
history.replace({ search: searchParams.toString() })
7980
}
8081

8182
const changePage = (page: number) => {

‎src/Common/Modals/VisibleModal.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -49,17 +49,17 @@ export class VisibleModal extends React.Component<{
4949
}
5050
}
5151

52-
render() {
53-
const handleBodyClick = (e: SyntheticEvent) => {
54-
e.stopPropagation()
52+
handleBodyClick = (e: SyntheticEvent) => {
53+
e.stopPropagation()
5554

56-
this.props?.close?.(e)
57-
}
55+
this.props.close?.(e)
56+
}
5857

58+
render() {
5959
return ReactDOM.createPortal(
6060
<div
6161
className={`visible-modal__body ${this.props.className}`}
62-
onClick={handleBodyClick}
62+
onClick={this.handleBodyClick}
6363
data-testid="visible-modal-close"
6464
>
6565
{this.props.children}

‎src/Common/Modals/VisibleModal2.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,17 +30,17 @@ export class VisibleModal2 extends React.Component<{ className: string; close?:
3030
preventBodyScroll(false)
3131
}
3232

33-
render() {
34-
const handleBodyClick = (e: SyntheticEvent) => {
35-
e.stopPropagation()
33+
handleBodyClick = (e: SyntheticEvent) => {
34+
e.stopPropagation()
3635

37-
this.props?.close?.(e)
38-
}
36+
this.props.close?.(e)
37+
}
3938

39+
render() {
4040
return ReactDOM.createPortal(
4141
<div
4242
className={`visible-modal__body ${this.props.className}`}
43-
onClick={handleBodyClick}
43+
onClick={this.handleBodyClick}
4444
data-testid="visible-modal2-close"
4545
>
4646
{this.props.children}

‎src/Common/Types.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -166,6 +166,7 @@ export interface ErrorScreenNotAuthorizedProps {
166166
export enum ImageType {
167167
Large = 'large',
168168
Medium = 'medium',
169+
SMALL = 'small',
169170
}
170171

171172
export interface InfoColourBarType {

‎src/Shared/Components/FeatureDescription/FeatureDescriptionModal.tsx

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
/*
2+
* Copyright (c) 2024. Devtron Inc.
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
import { VisibleModal, stopPropagation } from '../../../Common'
18+
import { BUTTON_TEXT } from './constant'
19+
import { FeatureDescriptionModalProps } from './types'
20+
import './featureDescription.scss'
21+
import { ReactComponent as ArrowOutSquare } from '../../../Assets/Icon/ic-arrow-square-out.svg'
22+
import { getImageSize } from './utils'
23+
24+
export const FeatureDescriptionModal = ({
25+
title,
26+
renderDescriptionContent,
27+
closeModalText = BUTTON_TEXT.GOT_IT,
28+
docLink = '',
29+
closeModal,
30+
imageVariant,
31+
SVGImage,
32+
imageStyles = {},
33+
}: FeatureDescriptionModalProps) => {
34+
const renderImage = () => {
35+
if (!SVGImage) {
36+
return null
37+
}
38+
return (
39+
<div className="flexbox dc__align-center dc__justify-center mt-16 mb-12">
40+
<SVGImage
41+
style={{
42+
...imageStyles,
43+
width: `${getImageSize(imageVariant).width}`,
44+
height: `${getImageSize(imageVariant).height}`,
45+
}}
46+
/>
47+
</div>
48+
)
49+
}
50+
const renderDescriptionBody = () => (
51+
<div className="pl-20 pr-20 pt-16 pb-16 dc__gap-16">
52+
<div className="flex left w-100 fs-16 fw-6">{title}</div>
53+
{renderImage()}
54+
{typeof renderDescriptionContent === 'function' && renderDescriptionContent()}
55+
</div>
56+
)
57+
58+
const renderFooter = () => (
59+
<div
60+
className={`flex right w-100 dc__align-right pt-16 dc__border-top-n1 pb-16 pl-20 pr-20 pt-6 pb-6 ${docLink ? 'dc__content-space' : 'right'}`}
61+
>
62+
{docLink.length > 0 && (
63+
<a
64+
className="flex dc__link en-2 bw-1 pl-8 pr-8 dc__gap-6 br-4 fw-6 lh-20 pt-6 pb-6 h-32"
65+
href={docLink}
66+
target="_blank"
67+
rel="noreferrer"
68+
>
69+
{BUTTON_TEXT.VIEW_DOCUMENTATION}
70+
<ArrowOutSquare className="icon-dim-16 scb-5" />
71+
</a>
72+
)}
73+
<button className="cta flex small" type="submit" onClick={closeModal}>
74+
{closeModalText}
75+
</button>
76+
</div>
77+
)
78+
79+
return (
80+
<VisibleModal className="" close={closeModal}>
81+
<div
82+
className="feature-description modal__body w-600 mt-40 flex column p-0 fs-13 dc__overflow-hidden"
83+
onClick={stopPropagation}
84+
>
85+
{renderDescriptionBody()}
86+
{renderFooter()}
87+
</div>
88+
</VisibleModal>
89+
)
90+
}

‎src/Shared/Components/FeatureDescription/FeatureTitleWithInfo.tsx

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
/*
2+
* Copyright (c) 2024. Devtron Inc.
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
import { useState } from 'react'
18+
import { DescriptorProps } from './types'
19+
import { ReactComponent as ICHelpOutline } from '../../../Assets/Icon/ic-help-outline.svg'
20+
import { BreadCrumb } from '../../../Common'
21+
import { FeatureDescriptionModal } from './FeatureDescriptionModal'
22+
23+
const FeatureTitleWithInfo = ({
24+
additionalContainerClasses,
25+
breadCrumbs,
26+
children,
27+
iconClassName,
28+
title,
29+
renderDescriptionContent,
30+
closeModalText,
31+
docLink,
32+
SVGImage,
33+
}: DescriptorProps) => {
34+
const [showFeatureDescriptionModal, setShowFeatureDescriptionModal] = useState(false)
35+
const onClickInfoIcon = () => {
36+
setShowFeatureDescriptionModal(true)
37+
}
38+
39+
const closeModal = () => {
40+
setShowFeatureDescriptionModal(false)
41+
}
42+
return (
43+
<>
44+
<div
45+
className={`feature-description flexbox dc__content-space dc__align-items-center w-100 ${additionalContainerClasses ?? ''}`}
46+
>
47+
<div className="flexbox dc__align-items-center dc__gap-4">
48+
<BreadCrumb breadcrumbs={breadCrumbs} />
49+
<ICHelpOutline className={`${iconClassName} icon-dim-20 cursor fcn-6`} onClick={onClickInfoIcon} />
50+
</div>
51+
52+
{children}
53+
</div>
54+
{showFeatureDescriptionModal && (
55+
<FeatureDescriptionModal
56+
title={title}
57+
renderDescriptionContent={renderDescriptionContent}
58+
closeModalText={closeModalText}
59+
docLink={docLink}
60+
closeModal={closeModal}
61+
SVGImage={SVGImage}
62+
/>
63+
)}
64+
</>
65+
)
66+
}
67+
68+
export default FeatureTitleWithInfo

‎src/Shared/Components/FeatureDescription/constant.ts

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
/*
2+
* Copyright (c) 2024. Devtron Inc.
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
export enum BUTTON_TEXT {
18+
GOT_IT = 'Got it',
19+
VIEW_DOCUMENTATION = 'View Documentation',
20+
}
21+
22+
export enum IMAGE_VARIANT {
23+
SMALL = 'small',
24+
LARGE = 'large',
25+
}

0 commit comments

Comments
 (0)