Skip to content

Commit f3d3869

Browse files
amitamrutiyaamitamrutiya
authored
Merge branch 'master' into workspace
2 parents 9f6dc3f + 968af22 commit f3d3869

10 files changed

Lines changed: 88 additions & 85 deletions

File tree

‎src/custom/CatalogDetail/OverviewSection.tsx‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -69,8 +69,6 @@ const OverviewSection: React.FC<OverviewSectionProps> = ({
6969
handleCopyUrl={handleCopyUrl}
7070
showShareAction={showShareAction}
7171
handleShare={handleShare}
72-
isVisibilityEnabled={isVisibilityEnabled}
73-
handleVisibilityChange={handleVisibilityChange}
7472
/>
7573
</div>
7674
<Grid container spacing={2}>
@@ -85,7 +83,13 @@ const OverviewSection: React.FC<OverviewSectionProps> = ({
8583
/>
8684
</ContentRow>
8785
)}
88-
<UserInfo details={details} showVersion={showVersion} userProfile={userProfile} />
86+
<UserInfo
87+
details={details}
88+
showVersion={showVersion}
89+
userProfile={userProfile}
90+
isVisibilityEnabled={isVisibilityEnabled}
91+
handleVisibilityChange={handleVisibilityChange}
92+
/>
8993
</Grid>
9094
</Grid>
9195
</Grid>

‎src/custom/CatalogDetail/SocialSharePopper.tsx‎

Lines changed: 4 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,11 @@
11
import React, { useState } from 'react';
2-
3-
import {
4-
ChainIcon,
5-
FacebookIcon,
6-
LinkedinIcon,
7-
LockIcon,
8-
PublicIcon,
9-
ShareIcon,
10-
TwitterIcon
11-
} from '../../icons';
2+
import { FacebookShareButton, LinkedinShareButton, TwitterShareButton } from 'react-share';
3+
import { Box, IconButton, Menu, MenuItem, Typography } from '../../base';
4+
import { ChainIcon, FacebookIcon, LinkedinIcon, ShareIcon, TwitterIcon } from '../../icons';
125
import { useTheme } from '../../theme';
136
import { Pattern } from '../CustomCatalog/CustomCard';
147
import { CustomTooltip } from '../CustomTooltip';
158
import { ErrorBoundary } from '../ErrorBoundary';
16-
17-
import { FacebookShareButton, LinkedinShareButton, TwitterShareButton } from 'react-share';
18-
import { Box, IconButton, Menu, MenuItem, Typography } from '../../base';
19-
import { VisibilityChipMenu } from '../VisibilityChipMenu';
20-
import { VIEW_VISIBILITY } from '../VisibilityChipMenu/VisibilityChipMenu';
219
import { CopyShareIconWrapper, ShareButton, ShareButtonGroup, ShareSideButton } from './style';
2210

2311
interface SocialSharePopperProps {
@@ -29,8 +17,6 @@ interface SocialSharePopperProps {
2917
handleCopyUrl: (type: string, name: string, id: string) => void;
3018
showShareAction: boolean;
3119
handleShare: () => void;
32-
isVisibilityEnabled: boolean;
33-
handleVisibilityChange: (visibility: VIEW_VISIBILITY) => void;
3420
}
3521

3622
const SocialSharePopper: React.FC<SocialSharePopperProps> = ({
@@ -40,9 +26,7 @@ const SocialSharePopper: React.FC<SocialSharePopperProps> = ({
4026
title,
4127
getUrl,
4228
handleCopyUrl,
43-
handleShare,
44-
isVisibilityEnabled,
45-
handleVisibilityChange
29+
handleShare
4630
}) => {
4731
const theme = useTheme();
4832
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
@@ -61,16 +45,6 @@ const SocialSharePopper: React.FC<SocialSharePopperProps> = ({
6145
return (
6246
<ErrorBoundary>
6347
<CopyShareIconWrapper style={{ marginBottom: '2rem' }}>
64-
<VisibilityChipMenu
65-
value={details?.visibility as VIEW_VISIBILITY}
66-
onChange={(value) => handleVisibilityChange(value as VIEW_VISIBILITY)}
67-
enabled={isVisibilityEnabled}
68-
options={[
69-
[VIEW_VISIBILITY.PUBLIC, PublicIcon],
70-
[VIEW_VISIBILITY.PRIVATE, LockIcon]
71-
]}
72-
/>
73-
7448
<ShareButtonGroup variant="contained">
7549
<CustomTooltip title="Change access and visibility">
7650
<ShareButton variant="contained" onClick={handleShare}>

‎src/custom/CatalogDetail/UserInfo.tsx‎

Lines changed: 24 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
import { Avatar } from '../../base';
22
import { CLOUD_URL } from '../../constants/constants';
3+
import { LockIcon, PublicIcon } from '../../icons';
34
import { Pattern } from '../CustomCatalog/CustomCard';
45
import { getVersion } from '../CustomCatalog/Helper';
6+
import { VisibilityChipMenu } from '../VisibilityChipMenu';
7+
import { VIEW_VISIBILITY } from '../VisibilityChipMenu/VisibilityChipMenu';
58
import { formatDate } from './helper';
69
import { ContentDetailsPoints, ContentDetailsText, ContentRow, RedirectLink } from './style';
710
import { UserProfile } from './types';
@@ -10,9 +13,17 @@ interface UserInfoProps {
1013
details: Pattern;
1114
showVersion?: boolean;
1215
userProfile?: UserProfile;
16+
isVisibilityEnabled: boolean;
17+
handleVisibilityChange: (visibility: VIEW_VISIBILITY) => void;
1318
}
1419

15-
const UserInfo: React.FC<UserInfoProps> = ({ details, showVersion = true, userProfile }) => {
20+
const UserInfo: React.FC<UserInfoProps> = ({
21+
details,
22+
showVersion = true,
23+
userProfile,
24+
isVisibilityEnabled,
25+
handleVisibilityChange
26+
}) => {
1627
return (
1728
<>
1829
<ContentRow>
@@ -57,6 +68,18 @@ const UserInfo: React.FC<UserInfoProps> = ({ details, showVersion = true, userPr
5768
<ContentDetailsText>{getVersion(details)}</ContentDetailsText>
5869
</ContentRow>
5970
)}
71+
<ContentRow>
72+
<ContentDetailsPoints>VISIBILITY</ContentDetailsPoints>
73+
<VisibilityChipMenu
74+
value={details?.visibility as VIEW_VISIBILITY}
75+
onChange={(value) => handleVisibilityChange(value as VIEW_VISIBILITY)}
76+
enabled={isVisibilityEnabled}
77+
options={[
78+
[VIEW_VISIBILITY.PUBLIC, PublicIcon],
79+
[VIEW_VISIBILITY.PRIVATE, LockIcon]
80+
]}
81+
/>
82+
</ContentRow>
6083
</>
6184
);
6285
};

‎src/custom/CustomTooltip/customTooltip.tsx‎

Lines changed: 29 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import _ from 'lodash';
12
import React from 'react';
23
import { Tooltip, TooltipProps } from '../../base';
34
import { WHITE } from '../../theme';
@@ -11,6 +12,7 @@ type CustomTooltipProps = {
1112
fontWeight?: number;
1213
variant?: 'standard' | 'small';
1314
bgColor?: string;
15+
componentsProps?: TooltipProps['componentsProps'];
1416
} & Omit<TooltipProps, 'title' | 'onClick'>;
1517

1618
function CustomTooltip({
@@ -22,34 +24,39 @@ function CustomTooltip({
2224
fontWeight = 400,
2325
variant = 'standard',
2426
bgColor = '#141414',
27+
componentsProps = {},
2528
...props
2629
}: CustomTooltipProps): JSX.Element {
2730
return (
2831
<Tooltip
29-
componentsProps={{
30-
tooltip: {
31-
sx: {
32-
background: bgColor,
33-
color: WHITE,
34-
fontSize: fontSize || (variant === 'standard' ? '1rem' : '0.75rem'),
35-
fontWeight: { fontWeight },
36-
borderRadius: '0.5rem',
37-
padding: variant === 'standard' ? '0.9rem' : '0.5rem 0.75rem',
38-
boxShadow: 'rgba(0, 0, 0, 0.6) 0px 4px 10px, rgba(0, 0, 0, 0.5) 0px 2px 4px'
32+
componentsProps={_.merge(
33+
{
34+
tooltip: {
35+
sx: {
36+
background: bgColor,
37+
color: WHITE,
38+
maxWidth: '600px',
39+
fontSize: fontSize || (variant === 'standard' ? '1rem' : '0.75rem'),
40+
fontWeight: { fontWeight },
41+
borderRadius: '0.5rem',
42+
padding: variant === 'standard' ? '0.9rem' : '0.5rem 0.75rem',
43+
boxShadow: 'rgba(0, 0, 0, 0.6) 0px 4px 10px, rgba(0, 0, 0, 0.5) 0px 2px 4px'
44+
}
45+
},
46+
popper: {
47+
sx: {
48+
zIndex: 9999999999,
49+
opacity: '1'
50+
}
51+
},
52+
arrow: {
53+
sx: {
54+
color: bgColor
55+
}
3956
}
4057
},
41-
popper: {
42-
sx: {
43-
zIndex: 9999999999,
44-
opacity: '1'
45-
}
46-
},
47-
arrow: {
48-
sx: {
49-
color: bgColor
50-
}
51-
}
52-
}}
58+
componentsProps
59+
)}
5360
title={typeof title === 'string' ? <RenderMarkdownTooltip content={title} /> : title}
5461
placement={placement}
5562
arrow

‎src/custom/DashboardWidgets/GettingStartedWidget/ActionButtonCard.tsx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@ const BoxContainer = styled(Card)<{ playgroundCardBackgroundImgSrc?: string }>(
2929
backgroundPosition: 'right bottom',
3030
backgroundSize: 'cover',
3131
backgroundRepeat: 'no-repeat',
32-
minWidth: 285,
3332
height: '100%',
3433
position: 'relative',
3534
backgroundColor:
@@ -38,7 +37,6 @@ const BoxContainer = styled(Card)<{ playgroundCardBackgroundImgSrc?: string }>(
3837
);
3938

4039
const StyledCard = styled(Card)(({ theme }) => ({
41-
minWidth: 275,
4240
height: '100%',
4341
backgroundColor:
4442
theme.palette.mode === 'dark' ? theme.palette.background.card : theme.palette.common.white

‎src/custom/DashboardWidgets/PlainCard.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import { OpenInNewIcon } from '../../icons';
33
import { styled } from '../../theme';
44

55
const StyledCard = styled(Card)(({ theme }) => ({
6-
minWidth: 275,
76
height: '100%',
87
backgroundColor:
98
theme.palette.mode === 'dark' ? theme.palette.background.card : theme.palette.common.white

‎src/custom/DashboardWidgets/RecentDesignWidget.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -159,7 +159,6 @@ const DesignCard: React.FC<DesignCardProps> = ({
159159
<>
160160
<Card
161161
sx={{
162-
minWidth: 275,
163162
height: '100%',
164163
backgroundColor:
165164
theme.palette.mode === 'dark'

‎src/custom/DashboardWidgets/WorkspaceActivityWidget.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,6 @@ interface WorkspaceActivityCardProps {
4040

4141
const StyledCard = styled(Card)(({ theme }) => ({
4242
padding: '1rem',
43-
minWidth: 275,
4443
height: '100%',
4544
overflowY: 'auto',
4645
backgroundColor:

‎src/custom/ResourceDetailFormatters/Formatter.tsx‎

Lines changed: 23 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -157,7 +157,7 @@ export const PortsFormatter: React.FC<PortsFormatterProps> = ({ data }) => {
157157
{data?.map((item, index) => (
158158
<Details noPadding key={index}>
159159
<Box display="flex" alignItems="center">
160-
<Typography variant="body1">{`${item.name}: `} </Typography>
160+
{item.name && <Typography variant="body1">{`${item.name}: `} </Typography>}
161161
<ElementData>{`(${item.containerPort || item.port}/${item.protocol})`}</ElementData>
162162
</Box>
163163
</Details>
@@ -580,8 +580,9 @@ export const ContainerFormatter: React.FC<ContainerFormatterProps> = ({
580580
containerSpec,
581581
containerStatus
582582
}) => {
583-
const status = _.capitalize(Object.keys(containerStatus.state)[0]);
584-
const stateValues = Object.values(containerStatus.state)[0];
583+
const state = containerStatus?.state || {};
584+
const status = _.capitalize(Object.keys(state)?.[0] || 'unknown');
585+
const stateValues = Object.values(state)?.[0] || {};
585586
const startedAt = stateValues ? stateValues?.startedAt : null;
586587
return (
587588
<Box display="flex" flexDirection="column" gap={'0.5rem'}>
@@ -601,89 +602,89 @@ export const ContainerFormatter: React.FC<ContainerFormatterProps> = ({
601602
/>
602603
<DetailSection
603604
title="Image Pull Policy"
604-
data={containerSpec.imagePullPolicy}
605+
data={containerSpec?.imagePullPolicy}
605606
formatter={({ data }) => <Typography variant="body1">{data}</Typography>}
606607
/>
607608

608609
<DetailSection
609610
title="Total Restarts"
610-
data={containerStatus.restartCount}
611+
data={containerStatus?.restartCount}
611612
formatter={({ data }) => <NumberState value={data} quantity="times" />}
612613
/>
613614

614615
<DetailSection
615616
title="Image"
616-
data={containerSpec.image}
617+
data={containerSpec?.image}
617618
formatter={({ data }) => <StyledChip label={data} size="small" />}
618619
/>
619620
<DetailSection
620621
title="Container"
621-
data={containerStatus.containerID}
622+
data={containerStatus?.containerID}
622623
formatter={({ data }) => <StyledChip label={data} size="small" />}
623624
/>
624625

625626
<DetailSection
626627
title="Environment Variables"
627-
data={containerSpec.env}
628+
data={containerSpec?.env}
628629
formatter={EnvironmentFormatter}
629630
/>
630631

631632
<KeyValueInRow
632633
Key="Volume Mounts"
633634
Value={
634635
<Box display={'flex'} flexDirection={'column'} gap={1}>
635-
{containerSpec.volumeMounts?.map((item, index) => {
636-
const roStatus = item.readOnly ? ' (RO)' : ' (RW)';
636+
{containerSpec?.volumeMounts?.map((item, index) => {
637+
const roStatus = item?.readOnly ? ' (RO)' : ' (RW)';
637638
return (
638639
<Box display={'flex'} key={index} flexWrap={'wrap'} gap={'0.25rem 0.5rem'}>
639640
<ElementData key={index}>
640-
<StyledChip label={item.mountPath} size="small" />
641+
<StyledChip label={item?.mountPath} size="small" />
641642
</ElementData>
642643
<ElementData>
643-
<Typography variant="body1">{`from ${item.name}${roStatus}`}</Typography>
644+
<Typography variant="body1">{`from ${item?.name}${roStatus}`}</Typography>
644645
</ElementData>
645646
</Box>
646647
);
647648
})}
648649
</Box>
649650
}
650651
/>
651-
{containerSpec.command && (
652+
{containerSpec?.command && (
652653
<DetailSection title="Command" data={containerSpec.command} formatter={CodeFormatter} />
653654
)}
654-
{containerSpec.livenessProbe && (
655+
{containerSpec?.livenessProbe && (
655656
<DetailSection
656657
title="Liveness Probe"
657658
data={containerSpec.livenessProbe}
658659
formatter={CodeFormatter}
659660
/>
660661
)}
661-
{containerSpec.readinessProbe && (
662+
{containerSpec?.readinessProbe && (
662663
<DetailSection
663664
title="Readiness Probe"
664-
data={containerSpec.readinessProbe}
665+
data={containerSpec?.readinessProbe}
665666
formatter={CodeFormatter}
666667
/>
667668
)}
668-
{containerSpec.startupProbe && (
669+
{containerSpec?.startupProbe && (
669670
<DetailSection
670671
title="Startup Probe"
671-
data={containerSpec.startupProbe}
672+
data={containerSpec?.startupProbe}
672673
formatter={CodeFormatter}
673674
/>
674675
)}
675-
<DetailSection title="Arguments" data={containerSpec.args} formatter={CodeFormatter} />
676+
<DetailSection title="Arguments" data={containerSpec?.args} formatter={CodeFormatter} />
676677
{containerSpec.resources?.requests && (
677678
<DetailSection
678679
title="Resources"
679-
data={containerSpec.resources.requests}
680+
data={containerSpec?.resources?.requests}
680681
formatter={CodeFormatter}
681682
/>
682683
)}
683-
{containerSpec.resources?.limits && (
684+
{containerSpec?.resources?.limits && (
684685
<DetailSection
685686
title="Limits"
686-
data={containerSpec.resources.limits}
687+
data={containerSpec?.resources?.limits}
687688
formatter={CodeFormatter}
688689
/>
689690
)}

‎src/custom/VisibilityChipMenu/VisibilityChipMenu.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,7 @@ const StyledMenu = styled(Menu)(({ theme }) => ({
4646
}));
4747

4848
const StyledButton = styled(Button)(() => ({
49-
padding: '0px',
50-
width: '100%'
49+
padding: '0px'
5150
}));
5251

5352
const StyledDiv = styled('div')(

0 commit comments

Comments
 (0)