Skip to content

Commit 2aa231c

Browse files
committed
rm merge conflicts
Signed-off-by: Sudhanshu Dasgupta <dasguptashivam23@gmail.com>
2 parents d67c431 + 588d510 commit 2aa231c

23 files changed

Lines changed: 261 additions & 59 deletions

.github/workflows/preview-site.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ jobs:
1414
uses: actions/checkout@v2.3.1
1515

1616
- name: Download Site dir
17-
uses: dawidd6/action-download-artifact@v2
17+
uses: dawidd6/action-download-artifact@v6
1818
with:
1919
github_token: ${{ secrets.GH_ACCESS_TOKEN }}
2020
workflow: build-and-preview-site.yml

src/constants/iconsSizes.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
// icon styles, setting general height and width properties to solves scaling and consistency problems
22

3+
export const iconXSmall = {
4+
height: 16,
5+
width: 16
6+
};
7+
38
export const iconSmall = {
49
height: 20,
510
width: 20

src/custom/CatalogDesignTable/CatalogDesignTable.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ interface CatalogDesignsTableProps {
2525
setPage: (page: number) => void;
2626
columnVisibility: Record<string, boolean>;
2727
colViews: ColView[];
28+
rowsPerPageOptions?: number[];
2829
handleBulkDeleteModal: (patterns: Pattern[], modalRef: React.RefObject<PromptRef>) => void;
2930
setSearch?: (search: string) => void;
3031
handleBulkpatternsDataUnpublishModal: (
@@ -49,6 +50,7 @@ export const CatalogDesignsTable: React.FC<CatalogDesignsTableProps> = ({
4950
colViews = [],
5051
handleBulkDeleteModal,
5152
setSearch,
53+
rowsPerPageOptions = [10, 25, 50, 100],
5254
handleBulkpatternsDataUnpublishModal
5355
}) => {
5456
const theme = useTheme();
@@ -144,10 +146,9 @@ export const CatalogDesignsTable: React.FC<CatalogDesignsTableProps> = ({
144146
page,
145147
elevation: 0,
146148
sortOrder: {
147-
name: 'updated_at',
148-
direction: 'desc'
149+
name: sortOrder.split(' ')[0],
150+
direction: sortOrder.split(' ')[1]
149151
},
150-
151152
onTableChange: handleTableChange,
152153
customToolbarSelect: _.isNil(filter)
153154
? (selected: any) => (
@@ -175,6 +176,7 @@ export const CatalogDesignsTable: React.FC<CatalogDesignsTableProps> = ({
175176
filter,
176177
totalCount,
177178
pageSize,
179+
sortOrder,
178180
page,
179181
handleTableChange,
180182
patterns,
@@ -195,6 +197,7 @@ export const CatalogDesignsTable: React.FC<CatalogDesignsTableProps> = ({
195197
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
196198
//@ts-ignore
197199
data={patterns || []}
200+
rowsPerPageOptions={rowsPerPageOptions}
198201
options={options}
199202
colViews={colViews}
200203
tableCols={processedColumns}

src/custom/CatalogDesignTable/DesignTableColumnConfig.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ export const createDesignsColumnsConfig = ({
7272
},
7373
{
7474
name: 'name',
75-
label: 'Pattern Name',
75+
label: 'Name',
7676
options: {
7777
filter: false,
7878
sort: true,

src/custom/CatalogDetail/ActionButton.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -80,15 +80,15 @@ const ActionButtons: React.FC<ActionButtonsProps> = ({
8080
backgroundColor: 'transparent',
8181
border: `1px solid ${theme.palette.border.normal}`,
8282
gap: '10px',
83-
color: charcoal[10]
83+
color: theme.palette.text.default
8484
}}
8585
onClick={() =>
8686
cleanedType === RESOURCE_TYPES.FILTERS
8787
? downloadFilter(details.id, details.name)
8888
: downloadYaml(details.pattern_file, details.name)
8989
}
9090
>
91-
<Download width={24} height={24} fill={charcoal[10]} />
91+
<Download width={24} height={24} fill={theme.palette.icon.default} />
9292
Download
9393
</ActionButton>
9494

@@ -108,7 +108,7 @@ const ActionButtons: React.FC<ActionButtonsProps> = ({
108108
<CircularProgress size={24} color={'inherit'} />
109109
) : (
110110
<>
111-
<CopyIcon width={24} height={24} fill={charcoal[10]} />
111+
<CopyIcon width={24} height={24} fill={theme.palette.icon.default} />
112112
Clone
113113
</>
114114
)}
@@ -136,7 +136,7 @@ const ActionButtons: React.FC<ActionButtonsProps> = ({
136136
}}
137137
onClick={handleInfoClick}
138138
>
139-
<EditIcon width={24} height={24} fill={charcoal[10]} />
139+
<EditIcon width={24} height={24} fill={theme.palette.icon.default} />
140140
Edit
141141
</ActionButton>
142142
)}
@@ -151,7 +151,7 @@ const ActionButtons: React.FC<ActionButtonsProps> = ({
151151
}}
152152
onClick={handleShare}
153153
>
154-
<ShareLineIcon width="24" height="24" fill={charcoal[10]} />
154+
<ShareLineIcon width="24" height="24" fill={theme.palette.icon.default} />
155155
Share
156156
</ActionButton>
157157
)}

src/custom/CatalogDetail/RelatedDesigns.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,13 +36,13 @@ const RelatedDesigns: React.FC<RelatedDesignsProps> = ({
3636
);
3737

3838
if (!filteredPatternsPerUser?.length) return null;
39-
39+
const organizationName = fetchingOrgError || !orgName ? 'Unknown Organization' : orgName;
4040
return (
4141
<AdditionalContainer>
4242
<ContentHeading>
4343
<h2 style={{ margin: '0', textTransform: 'uppercase' }}>
4444
Other published design by {formatToTitleCase(userProfile?.first_name ?? '')}{' '}
45-
{fetchingOrgError ? '' : `under ${orgName}`}
45+
{fetchingOrgError ? '' : `under ${organizationName}`}
4646
</h2>
4747
</ContentHeading>
4848
<DesignCardContainer>

src/custom/CatalogDetail/SocialSharePopper.tsx

Lines changed: 23 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,24 @@
11
import { Box, IconButton, Menu, MenuItem } from '@mui/material';
22
import React, { useState } from 'react';
33
import { FacebookShareButton, LinkedinShareButton, TwitterShareButton } from 'react-share';
4-
import { ChainIcon, FacebookIcon, LinkedinIcon, ShareIcon, TwitterIcon } from '../../icons';
4+
5+
import {
6+
ChainIcon,
7+
FacebookIcon,
8+
LinkedinIcon,
9+
LockIcon,
10+
PublicIcon,
11+
ShareIcon,
12+
TwitterIcon
13+
} from '../../icons';
514
import { useTheme } from '../../theme';
615
import { Pattern } from '../CustomCatalog/CustomCard';
716
import { CustomTooltip } from '../CustomTooltip';
817
import { ErrorBoundary } from '../ErrorBoundary';
9-
import { CopyShareIconWrapper, VisibilityChip } from './style';
18+
19+
import { VisibilityChipMenu } from '../VisibilityChipMenu';
20+
import { VIEW_VISIBILITY } from '../VisibilityChipMenu/VisibilityChipMenu';
21+
import { CopyShareIconWrapper } from './style';
1022

1123
interface SocialSharePopperProps {
1224
details: Pattern;
@@ -44,13 +56,15 @@ const SocialSharePopper: React.FC<SocialSharePopperProps> = ({
4456
return (
4557
<ErrorBoundary>
4658
<CopyShareIconWrapper style={{ marginBottom: '2rem' }}>
47-
<VisibilityChip
48-
style={{
49-
color: theme.palette.text.default
50-
}}
51-
>
52-
{details?.visibility}
53-
</VisibilityChip>
59+
<VisibilityChipMenu
60+
value={details?.visibility as VIEW_VISIBILITY}
61+
onChange={() => {}}
62+
enabled={false}
63+
options={[
64+
[VIEW_VISIBILITY.PUBLIC, PublicIcon],
65+
[VIEW_VISIBILITY.PRIVATE, LockIcon]
66+
]}
67+
/>
5468

5569
<CustomTooltip title="Copy Link" placement="top" arrow>
5670
<IconButton

src/custom/CatalogDetail/style.tsx

Lines changed: 32 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import { Link, ListItemButton, Paper, Typography } from '../../base';
1+
import { Button, ButtonGroup, Link, ListItemButton, Typography } from '../../base';
22
import { styled } from '../../theme';
33
import { Theme } from './types';
44

5-
export const StyledActionWrapper = styled(Paper)(() => ({
5+
export const StyledActionWrapper = styled('div')(({ theme }) => ({
66
boxShadow: '0px 2px 4px rgba(0, 0, 0, 0.2)',
77
justifyContent: 'center',
88
width: '100%',
@@ -12,7 +12,8 @@ export const StyledActionWrapper = styled(Paper)(() => ({
1212
flexDirection: 'column',
1313
gap: '1rem',
1414
padding: '0.6rem',
15-
alignItems: 'center'
15+
alignItems: 'center',
16+
backgroundColor: theme.palette.background.default
1617
}));
1718

1819
interface ActionButtonProps {
@@ -139,7 +140,8 @@ export const ContentDetailsPoints = styled(Typography)(() => ({
139140
fontFamily: 'inherit'
140141
}));
141142

142-
export const MetricsSection = styled('div')(() => ({
143+
export const MetricsSection = styled('div')(({ theme }) => ({
144+
backgroundColor: theme.palette.background.default,
143145
padding: '1.1rem',
144146
marginTop: '0.5rem',
145147
display: 'flex',
@@ -152,7 +154,8 @@ export const MetricsSection = styled('div')(() => ({
152154
}
153155
}));
154156

155-
export const MetricsContainer = styled('div')(() => ({
157+
export const MetricsContainer = styled('div')(({ theme }) => ({
158+
backgroundColor: theme.palette.background.default,
156159
display: 'flex',
157160
flexDirection: 'column',
158161
justifyContent: 'center',
@@ -236,13 +239,14 @@ export const AdditionalContainer = styled('div')(({ theme }) => ({
236239
borderRadius: '0.4rem'
237240
}));
238241

239-
export const DesignCardContainer = styled('div')(() => ({
242+
export const DesignCardContainer = styled('div')(({ theme }) => ({
240243
display: 'flex',
241244
flexWrap: 'wrap',
242245
flex: '0 0 75%',
243246
gap: '2rem',
244247
justifyContent: 'space-around',
245-
height: 'fit-content'
248+
height: 'fit-content',
249+
backgroundColor: theme.palette.background.default
246250
}));
247251

248252
export const CopyShareIconWrapper = styled(ContentHeading)(() => ({
@@ -251,17 +255,29 @@ export const CopyShareIconWrapper = styled(ContentHeading)(() => ({
251255
width: 'fit-content'
252256
}));
253257

254-
export const VisibilityChip = styled('div')(() => ({
255-
borderRadius: '0.5rem',
256-
border: '1px solid gray',
257-
padding: '0.2rem 0.5rem',
258-
textTransform: 'capitalize',
259-
color: '#1a1a1acc',
260-
width: 'fit-content'
261-
}));
262-
263258
export const RedirectLink = styled(Link)(({ theme }) => ({
264259
color: theme.palette.background.brand?.default,
265260
textDecoration: 'none',
266261
cursor: 'pointer'
267262
}));
263+
264+
export const ShareButtonGroup = styled(ButtonGroup)({
265+
boxShadow: 'none',
266+
border: 'none',
267+
outline: 'none',
268+
height: '76%'
269+
});
270+
271+
export const ShareButton = styled(Button)(({ theme }) => ({
272+
backgroundColor: theme.palette.background.brand?.default,
273+
color: 'white',
274+
border: 'none',
275+
borderRadius: '0.5rem 0px 0px 0.5rem'
276+
}));
277+
278+
export const ShareSideButton = styled(Button)(({ theme }) => ({
279+
backgroundColor: theme.palette.background.brand?.default,
280+
color: 'white',
281+
border: 'none',
282+
borderRadius: '0px 0.5rem 0.5rem 0px'
283+
}));

src/custom/CustomTooltip/customTooltip.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { Tooltip, type TooltipProps } from '@mui/material';
21
import React from 'react';
2+
import { Tooltip, TooltipProps } from '../../base';
33
import { WHITE } from '../../theme';
44
import { RenderMarkdownTooltip } from '../Markdown';
55

@@ -21,7 +21,7 @@ function CustomTooltip({
2121
fontSize,
2222
fontWeight = 400,
2323
variant = 'standard',
24-
bgColor = '#333333',
24+
bgColor = '#141414',
2525
...props
2626
}: CustomTooltipProps): JSX.Element {
2727
return (
@@ -35,8 +35,7 @@ function CustomTooltip({
3535
fontWeight: { fontWeight },
3636
borderRadius: '0.5rem',
3737
padding: variant === 'standard' ? '0.9rem' : '0.5rem 0.75rem',
38-
boxShadow:
39-
'rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px'
38+
boxShadow: 'rgba(0, 0, 0, 0.6) 0px 4px 10px, rgba(0, 0, 0, 0.5) 0px 2px 4px'
4039
}
4140
},
4241
popper: {

src/custom/ResponsiveDataTable.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@ export const DataTableEllipsisMenu: React.FC<{
5757
open={Boolean(anchorEl)}
5858
onClose={handleClose}
5959
sx={{
60+
fontFamily: theme?.typography.fontFamily,
6061
'& .MuiPaper-root': {
6162
backgroundColor: theme?.palette.background.default ?? 'white'
6263
}
@@ -122,6 +123,9 @@ export const DataTableEllipsisMenu: React.FC<{
122123

123124
const dataTableTheme = (theme: Theme, backgroundColor?: string) =>
124125
createTheme({
126+
typography: {
127+
fontFamily: theme.typography.fontFamily
128+
},
125129
components: {
126130
MuiPaper: {
127131
styleOverrides: {
@@ -134,7 +138,6 @@ const dataTableTheme = (theme: Theme, backgroundColor?: string) =>
134138
MuiTable: {
135139
styleOverrides: {
136140
root: {
137-
// border: `2px solid ${theme.palette.border.normal}`,
138141
width: '-webkit-fill-available',
139142
'@media (max-width: 500px)': {
140143
wordWrap: 'break-word'

0 commit comments

Comments
 (0)