Skip to content

Commit b3d1449

Browse files
sudhanshutechsudhanshutech
authored
Merge branch 'master' into ci-add-lint-checks
2 parents 3a273ad + 92bcc03 commit b3d1449

36 files changed

+974
-74
lines changed

‎.github/workflows/bump-meshery-version.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ jobs:
116116
cache: "npm"
117117
cache-dependency-path: '**/package-lock.json'
118118
- name: Make changes to pull request
119-
run: npm install @layer5/sistent@${{needs.versions-check.outputs.current}}
119+
run: npm install @layer5/sistent@${{needs.versions-check.outputs.current}} --legacy-peer-deps
120120
- name: Create Pull Request
121121
id: cpr
122122
uses: peter-evans/create-pull-request@v7

‎package-lock.json

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

‎package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,8 @@
119119
"billboard.js": "^3.14.3",
120120
"js-yaml": "^4.1.0",
121121
"lodash": "^4.17.21",
122+
"re-resizable": "^6.10.3",
123+
"react-draggable": "^4.4.6",
122124
"moment": "^2.30.1",
123125
"react-share": "^5.1.0"
124126
}

‎site/package-lock.json

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

‎src/base/Pagination/Pagination.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,13 @@
1-
import { Pagination as MuiPagination, PaginationProps as MuiPaginationProps } from '@mui/material';
1+
import {
2+
Pagination as MuiPagination,
3+
PaginationItem as MuiPaginationItem,
4+
PaginationProps as MuiPaginationProps
5+
} from '@mui/material';
26
import React from 'react';
37

48
const Pagination = React.forwardRef<HTMLDivElement, MuiPaginationProps>((props, ref) => {
59
return <MuiPagination {...props} ref={ref} />;
610
});
711

12+
export { MuiPaginationItem as PaginationItem };
813
export default Pagination;

‎src/base/Pagination/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { PaginationProps } from '@mui/material';
2-
import Pagination from './Pagination';
2+
import Pagination, { PaginationItem } from './Pagination';
33

4-
export { Pagination };
4+
export { Pagination, PaginationItem };
55
export type { PaginationProps };

‎src/custom/CatalogDetail/ActionButton.tsx

Lines changed: 19 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -76,31 +76,13 @@ const ActionButtons: React.FC<ActionButtonsProps> = ({
7676
width: '100%'
7777
}}
7878
>
79-
<ActionButton
80-
sx={{
81-
borderRadius: '0.2rem',
82-
backgroundColor: 'transparent',
83-
border: `1px solid ${theme.palette.border.normal}`,
84-
gap: '10px',
85-
color: theme.palette.text.default
86-
}}
87-
onClick={() =>
88-
cleanedType === VIEWS
89-
? downloadYaml(details.pattern_file, details.name)
90-
: downloadPattern(details.id, details.name, getDownloadUrl)
91-
}
92-
>
93-
<Download width={24} height={24} fill={theme.palette.icon.default} />
94-
Download
95-
</ActionButton>
96-
9779
{cleanedType !== FILTERS && (
9880
<ActionButton
9981
sx={{
82+
backgroundColor: showOpenPlaygroundAction ? 'transparent' : undefined,
83+
color: theme.palette.text.default,
10084
borderRadius: '0.2rem',
10185
gap: '10px',
102-
color: theme.palette.text.default,
103-
backgroundColor: 'transparent',
10486
border: `1px solid ${theme.palette.border.normal}`
10587
}}
10688
onClick={() => handleClone(details?.name, details?.id)}
@@ -116,6 +98,23 @@ const ActionButtons: React.FC<ActionButtonsProps> = ({
11698
)}
11799
</ActionButton>
118100
)}
101+
<ActionButton
102+
sx={{
103+
borderRadius: '0.2rem',
104+
backgroundColor: 'transparent',
105+
border: `1px solid ${theme.palette.border.normal}`,
106+
gap: '10px',
107+
color: theme.palette.text.default
108+
}}
109+
onClick={() =>
110+
cleanedType === VIEWS
111+
? downloadYaml(details.pattern_file, details.name)
112+
: downloadPattern(details.id, details.name, getDownloadUrl)
113+
}
114+
>
115+
<Download width={24} height={24} fill={theme.palette.icon.default} />
116+
Download
117+
</ActionButton>
119118
</div>
120119
)}
121120

‎src/custom/CatalogDetail/style.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -264,8 +264,7 @@ export const RedirectLink = styled(Link)(({ theme }) => ({
264264
export const ShareButtonGroup = styled(ButtonGroup)({
265265
boxShadow: 'none',
266266
border: 'none',
267-
outline: 'none',
268-
height: '76%'
267+
outline: 'none'
269268
});
270269

271270
export const ShareButton = styled(Button)(({ theme }) => ({

‎src/custom/Panel/Panel.tsx

Lines changed: 103 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,103 @@
1+
import { Resizable } from 're-resizable';
2+
import React from 'react';
3+
import Draggable from 'react-draggable';
4+
import { Box, BoxProps, IconButton, Tooltip } from '../../base';
5+
import { CloseIcon, CollapseAllIcon, ExpandAllIcon } from '../../icons';
6+
import { PanelDragHandleIcon } from '../../icons/PanelDragHandle';
7+
import { useTheme } from '../../theme';
8+
import { ErrorBoundary } from '../ErrorBoundary';
9+
import {
10+
DragHandle,
11+
DrawerHeader,
12+
HeaderActionsContainer,
13+
HeaderContainer,
14+
PanelBody,
15+
PanelContainer,
16+
ResizableContent
17+
} from './style';
18+
19+
export type PanelProps = {
20+
isOpen: boolean;
21+
children: React.ReactNode;
22+
areAllExpanded?: boolean;
23+
toggleExpandAll?: () => void;
24+
handleClose: () => void;
25+
sx?: BoxProps['sx'];
26+
id?: string;
27+
intitialPosition?: {
28+
left?: string | number;
29+
right?: string | number;
30+
top?: string | number;
31+
bottom?: string | number;
32+
};
33+
};
34+
35+
const Panel_: React.FC<PanelProps> = ({
36+
isOpen,
37+
id = 'panel',
38+
children,
39+
areAllExpanded,
40+
toggleExpandAll,
41+
handleClose,
42+
intitialPosition,
43+
sx
44+
}) => {
45+
const theme = useTheme();
46+
if (!isOpen) return null;
47+
return (
48+
<Draggable handle=".drag-handle">
49+
<PanelContainer theme={theme} intitialPosition={intitialPosition} sx={sx}>
50+
<Resizable
51+
defaultSize={{ width: '18rem', height: 'auto' }}
52+
onResize={() => {
53+
window.dispatchEvent(new Event('panel-resize'));
54+
}}
55+
enable={{
56+
top: true,
57+
right: true,
58+
bottom: true,
59+
left: true,
60+
topRight: true,
61+
bottomRight: true,
62+
bottomLeft: true,
63+
topLeft: true
64+
}}
65+
>
66+
<ResizableContent>
67+
<ErrorBoundary>
68+
<div className="drag-handle">
69+
<DrawerHeader>
70+
<Box display="flex" justifyContent="flex-end" padding="8px">
71+
{toggleExpandAll && (
72+
<Tooltip title={areAllExpanded ? 'Collapse All' : 'Expand All'}>
73+
<IconButton onClick={toggleExpandAll}>
74+
{areAllExpanded ? <CollapseAllIcon /> : <ExpandAllIcon />}
75+
</IconButton>
76+
</Tooltip>
77+
)}
78+
</Box>
79+
<DragHandle>
80+
<PanelDragHandleIcon />
81+
</DragHandle>
82+
<HeaderContainer>
83+
<HeaderActionsContainer
84+
id={`${id}-panel-header-actions-container`}
85+
></HeaderActionsContainer>
86+
<IconButton onClick={handleClose}>
87+
<CloseIcon />
88+
</IconButton>
89+
</HeaderContainer>
90+
</DrawerHeader>
91+
</div>
92+
<PanelBody className="panel-body">{children}</PanelBody>
93+
</ErrorBoundary>
94+
</ResizableContent>
95+
</Resizable>
96+
</PanelContainer>
97+
</Draggable>
98+
);
99+
};
100+
101+
export const Panel: React.FC<PanelProps> = ({ ...props }) => {
102+
return <Panel_ {...props} />;
103+
};

‎src/custom/Panel/index.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { Panel } from './Panel';
2+
3+
export { Panel };

0 commit comments

Comments
 (0)