Skip to content

Commit b64a5b6

Browse files
FaheemOnHubFaheemOnHub
authored
Merge branch 'master' into fix/3516/searchFunc
2 parents ae09666 + 7371ba6 commit b64a5b6

File tree

12 files changed

+362
-130
lines changed

12 files changed

+362
-130
lines changed

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

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -45,13 +45,13 @@ jobs:
4545
uses: peter-evans/create-pull-request@v7
4646
with:
4747
token: ${{ secrets.RELEASEDRAFTER_PAT }}
48-
commit-message: Bump sistent v${{ needs.versions-check.outputs.current }} dependencies
48+
commit-message: Update to Sistent v${{ needs.versions-check.outputs.current }} dependencies
4949
committer: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
5050
author: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
5151
signoff: true
5252
branch: bump-sistent-bot
5353
delete-branch: true
54-
title: '[Chore]: Bump Sistent v${{ needs.versions-check.outputs.current }}'
54+
title: '[Chore]: Update to Sistent v${{ needs.versions-check.outputs.current }}'
5555
add-paths: |
5656
ui/package.json
5757
ui/package-lock.json
@@ -84,13 +84,13 @@ jobs:
8484
uses: peter-evans/create-pull-request@v7
8585
with:
8686
token: ${{ secrets.RELEASEDRAFTER_PAT }}
87-
commit-message: Bump sistent v${{ needs.versions-check.outputs.current }} dependencies
87+
commit-message: Update to Sistent v${{ needs.versions-check.outputs.current }} dependencies
8888
committer: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
8989
author: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
9090
signoff: true
9191
branch: bump-sistent-bot
9292
delete-branch: true
93-
title: '[Chore]: Bump Sistent v${{needs.versions-check.outputs.current }}'
93+
title: '[Chore]: Update to Sistent v${{needs.versions-check.outputs.current }}'
9494
add-paths: |
9595
meshmap/package.json
9696
meshmap/package-lock.json
@@ -128,7 +128,7 @@ jobs:
128128
signoff: true
129129
branch: bump-sistent-bot
130130
delete-branch: true
131-
title: '[Chore]: Bump Sistent v${{ needs.versions-check.outputs.current }}'
131+
title: '[Chore]: Update to Sistent v${{ needs.versions-check.outputs.current }}'
132132
add-paths: |
133133
package.json
134134
package-lock.json
@@ -161,13 +161,13 @@ jobs:
161161
uses: peter-evans/create-pull-request@v7
162162
with:
163163
token: ${{ secrets.RELEASEDRAFTER_PAT }}
164-
commit-message: Bump sistent v${{ needs.versions-check.outputs.current }} dependencies
164+
commit-message: Update to Sistent v${{ needs.versions-check.outputs.current }} dependencies
165165
committer: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
166166
author: ${{ github.actor }} <${{ github.actor }}@users.noreply.github.com>
167167
signoff: true
168168
branch: bump-sistent-bot
169169
delete-branch: true
170-
title: '[Chore]: Bump Sistent v${{ needs.versions-check.outputs.current }}'
170+
title: '[Chore]: Update to Sistent v${{ needs.versions-check.outputs.current }}'
171171
add-paths: |
172172
ui/package.json
173173
ui/package-lock.json

‎CONTRIBUTING.md

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -145,8 +145,7 @@ This repository and site are available as open source under the terms of the [Ap
145145

146146
**Community First**
147147

148-
<p>The <a href="https://layer5.io">Layer5</a> community represents the largest collection of service mesh projects and their maintainers in the world.</p>
148+
<p>The <a href="https://layer5.io/community">Layer5 community</a> represents the largest collection of service mesh projects and their maintainers in the world.</p>
149149

150150
**Open Source First**
151-
152-
<p>Our projects establish industry standards and enable service developers, owners, and operators with repeatable patterns and best practices for managing all aspects of distributed services. Our shared commitment to the open source spirit push the Layer5 community and its projects forward.</p>
151+
<p>At Layer5, we champion developer-defined infrastructure, giving engineers the power to reshape application delivery. We empower operators in reimagining how they manage modern infrastructure: collaboratively.</p>

‎src/custom/InputSearchField/InputSearchField.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -84,8 +84,7 @@ const InputSearchField: React.FC<InputSearchFieldProps> = ({
8484
if (value === '') {
8585
setOpen(false);
8686
} else {
87-
const encodedValue = encodeURIComponent(value);
88-
fetchSuggestions(encodedValue);
87+
fetchSuggestions(value);
8988
setError('');
9089
setOpen(true);
9190
}

‎src/custom/LearningCard/LearningCard.tsx

Lines changed: 130 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
import React from 'react';
1+
import React, { useState } from 'react';
2+
import { Typography } from '../../base';
3+
import { ExternalLinkIcon } from '../../icons';
4+
import { Modal, ModalBody, ModalButtonPrimary, ModalButtonSecondary, ModalFooter } from '../Modal';
25
import {
36
Card2,
47
CardActive,
@@ -8,7 +11,8 @@ import {
811
CardLink,
912
CardParent,
1013
CardSubdata,
11-
CardWrapper
14+
CardWrapper,
15+
OwnLearningCard
1216
} from './style';
1317

1418
interface Tutorial {
@@ -28,17 +32,43 @@ interface Props {
2832
path?: string;
2933
courseCount: number;
3034
courseType: string;
35+
orgId?: string;
36+
modalContent?: string;
3137
}
3238

33-
const OptionalLink: React.FC<React.PropsWithChildren<{ path?: string }>> = ({ path, children }) => {
39+
const OptionalLink: React.FC<React.PropsWithChildren<{ path?: string; isExternal?: boolean }>> = ({
40+
path,
41+
children,
42+
isExternal
43+
}) => {
3444
if (!path) {
3545
return <>{children}</>;
3646
}
3747

38-
return <CardLink href={path}>{children}</CardLink>;
48+
return (
49+
<CardLink
50+
href={path}
51+
target={isExternal ? '_blank' : undefined}
52+
rel={isExternal ? 'noopener noreferrer' : undefined}
53+
>
54+
{children}
55+
</CardLink>
56+
);
3957
};
4058

41-
const LearningCard: React.FC<Props> = ({ tutorial, path, courseCount, courseType }) => {
59+
const LearningCard: React.FC<Props> = ({
60+
tutorial,
61+
path,
62+
courseCount,
63+
courseType,
64+
orgId,
65+
modalContent
66+
}) => {
67+
const isCreateLearningPath = courseType === 'learning-card';
68+
const [modalOpen, setModalOpen] = useState(false);
69+
70+
const handleModalOpen = () => setModalOpen(true);
71+
const handleModalClose = () => setModalOpen(false);
4272
return (
4373
<CardWrapper>
4474
{tutorial.frontmatter.disabled === 'yes' ? (
@@ -65,39 +95,102 @@ const LearningCard: React.FC<Props> = ({ tutorial, path, courseCount, courseType
6595
</CardParent>
6696
</Card2>
6797
) : (
68-
<OptionalLink path={path}>
69-
<CardActive>
70-
<CardParent style={{ borderTop: `5px solid ${tutorial.frontmatter.themeColor}` }}>
71-
<div>
72-
<CardHead>
73-
<h3>
74-
{tutorial.frontmatter.title
75-
? tutorial.frontmatter.title
76-
: tutorial.frontmatter.courseTitle}
77-
</h3>
78-
{tutorial.frontmatter.status ? (
79-
<p>
80-
<span>New</span>
81-
</p>
82-
) : null}
83-
</CardHead>
84-
<CardDesc>
85-
<p className="summary">{tutorial.frontmatter.description}</p>
86-
</CardDesc>
87-
<CardSubdata className="card-subdata">
88-
<p>
89-
{courseCount} {courseType}
90-
{courseCount > 1 ? 's' : ''}
91-
</p>
92-
</CardSubdata>
93-
<CardImage>
94-
<img src={tutorial.frontmatter.cardImage} />
95-
</CardImage>
96-
</div>
97-
</CardParent>
98-
</CardActive>
99-
</OptionalLink>
98+
<>
99+
{isCreateLearningPath ? (
100+
<OwnLearningCard onClick={handleModalOpen} style={{ cursor: 'pointer' }}>
101+
<CardParent style={{ borderTop: `5px solid ${tutorial.frontmatter.themeColor}` }}>
102+
<div>
103+
<CardHead>
104+
<h3>
105+
{tutorial.frontmatter.title
106+
? tutorial.frontmatter.title
107+
: tutorial.frontmatter.courseTitle}
108+
</h3>
109+
{isCreateLearningPath && path && (
110+
<ExternalLinkIcon width="24px" height="24px" />
111+
)}
112+
{tutorial.frontmatter.status ? (
113+
<p>
114+
<span>New</span>
115+
</p>
116+
) : null}
117+
</CardHead>
118+
<CardDesc>
119+
<p className="summary">{tutorial.frontmatter.description}</p>
120+
</CardDesc>
121+
<CardImage>
122+
<img src={tutorial.frontmatter.cardImage} />
123+
</CardImage>
124+
</div>
125+
</CardParent>
126+
</OwnLearningCard>
127+
) : (
128+
<OptionalLink path={path} isExternal={isCreateLearningPath}>
129+
<CardActive>
130+
<CardParent style={{ borderTop: `5px solid ${tutorial.frontmatter.themeColor}` }}>
131+
<div>
132+
<CardHead>
133+
<h3>
134+
{tutorial.frontmatter.title
135+
? tutorial.frontmatter.title
136+
: tutorial.frontmatter.courseTitle}
137+
</h3>
138+
{tutorial.frontmatter.status ? (
139+
<p>
140+
<span>New</span>
141+
</p>
142+
) : null}
143+
</CardHead>
144+
<CardDesc>
145+
<p className="summary">{tutorial.frontmatter.description}</p>
146+
</CardDesc>
147+
{!isCreateLearningPath && (
148+
<CardSubdata className="card-subdata">
149+
<p>
150+
{courseCount} {courseType}
151+
{courseCount > 1 ? 's' : ''}
152+
</p>
153+
</CardSubdata>
154+
)}
155+
<CardImage>
156+
<img src={tutorial.frontmatter.cardImage} />
157+
</CardImage>
158+
</div>
159+
</CardParent>
160+
</CardActive>
161+
</OptionalLink>
162+
)}
163+
</>
100164
)}
165+
166+
<Modal
167+
open={modalOpen}
168+
closeModal={handleModalClose}
169+
title={tutorial.frontmatter.title || tutorial.frontmatter.courseTitle}
170+
maxWidth="sm"
171+
>
172+
<ModalBody>
173+
<Typography variant="body1">{modalContent}</Typography>
174+
{orgId && (
175+
<Typography variant="body1" color="textSecondary">
176+
Your Organization ID: {orgId}
177+
</Typography>
178+
)}
179+
</ModalBody>
180+
<ModalFooter variant="filled">
181+
<ModalButtonSecondary onClick={handleModalClose}>Close</ModalButtonSecondary>
182+
{path && (
183+
<ModalButtonPrimary
184+
onClick={() => {
185+
window.open(path, '_blank');
186+
handleModalClose();
187+
}}
188+
>
189+
Visit Docs
190+
</ModalButtonPrimary>
191+
)}
192+
</ModalFooter>
193+
</Modal>
101194
</CardWrapper>
102195
);
103196
};

‎src/custom/LearningCard/style.tsx

Lines changed: 33 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,36 @@ const CardActive = styled('div')(({ theme }) => ({
1717
backgroundColor: theme.palette.mode === 'light' ? WHITE : BLACK
1818
}));
1919

20+
const OwnLearningCard = styled('div')(({ theme }) => ({
21+
cursor: 'pointer',
22+
transition: 'all 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.1s',
23+
position: 'relative',
24+
overflow: 'hidden',
25+
'&:hover': {
26+
boxShadow: `${theme.palette.background.brand?.default} 0px 0px 19px 6px`
27+
},
28+
background: `linear-gradient(135deg,
29+
rgba(255, 255, 255, 0.85) 0%,
30+
rgba(248, 250, 252, 0.9) 50%,
31+
rgba(241, 245, 249, 0.85) 100%)`,
32+
'&::before': {
33+
content: '""',
34+
position: 'absolute',
35+
top: 0,
36+
left: 0,
37+
right: 0,
38+
bottom: 0,
39+
background: `repeating-linear-gradient(
40+
45deg,
41+
transparent,
42+
transparent 15px,
43+
rgba(148, 163, 184, 0.1) 15px,
44+
rgba(148, 163, 184, 0.1) 30px
45+
)`,
46+
pointerEvents: 'none'
47+
}
48+
}));
49+
2050
const CardLink = styled('a')({
2151
color: 'black',
2252
textDecoration: 'none'
@@ -41,6 +71,7 @@ const Card2 = styled('div')(({ theme }) => ({
4171

4272
const CardHead = styled('div')(({ theme }) => ({
4373
display: 'flex',
74+
justifyContent: 'space-between',
4475
padding: '1rem',
4576
'& span': {
4677
border: `1px solid ${theme.palette.primary.dark}`,
@@ -100,5 +131,6 @@ export {
100131
CardLink,
101132
CardParent,
102133
CardSubdata,
103-
CardWrapper
134+
CardWrapper,
135+
OwnLearningCard
104136
};

‎src/custom/Markdown/index.tsx

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,15 @@ export const RenderMarkdown: React.FC<RenderMarkdownProps> = ({ content }) => {
6565
};
6666

6767
export const RenderMarkdownTooltip: React.FC<RenderMarkdownProps> = ({ content }) => {
68+
const processDescription = (desc: string | undefined): string | undefined => {
69+
if (!desc) return desc;
70+
try {
71+
// -> json.parse will handle esacpe characters
72+
return JSON.parse(`"${desc}"`);
73+
} catch {
74+
return desc;
75+
}
76+
};
6877
return (
6978
<ReactMarkdown
7079
remarkPlugins={[remarkGfm]}
@@ -96,7 +105,7 @@ export const RenderMarkdownTooltip: React.FC<RenderMarkdownProps> = ({ content }
96105
td: ({ ...props }) => <StyledMarkdownTd>{props.children}</StyledMarkdownTd>
97106
}}
98107
>
99-
{content}
108+
{processDescription(content) as string}
100109
</ReactMarkdown>
101110
);
102111
};

‎src/custom/NavigationNavbar/navigationNavbar.tsx

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,13 +52,17 @@ const NavigationNavbar: React.FC<NavigationNavbarProps> = ({
5252

5353
return (
5454
<React.Fragment key={item.id}>
55-
<MenuItem disabled={!permission} onClick={item.onClick}>
55+
<MenuItem
56+
disabled={!permission}
57+
onClick={item.onClick}
58+
data-testid={`nav-item-${item.id}`}
59+
>
5660
<MenuItemList>
5761
{item.icon && <IconWrapper>{item.icon}</IconWrapper>}
5862
<ListItemText primary={item.title} {...ListItemTextProps} />
5963
</MenuItemList>
6064
{item.subItems && (
61-
<ListItemText>
65+
<ListItemText data-testid={`nav-toggle-${item.id}`}>
6266
{isOpen ? (
6367
<ExpandLessIcon onClick={(e) => toggleSectionOpen(item.id, e)} />
6468
) : (
@@ -74,6 +78,7 @@ const NavigationNavbar: React.FC<NavigationNavbarProps> = ({
7478
key={subItem.id}
7579
disabled={!subItem.permission}
7680
onClick={subItem.onClick}
81+
data-testid={`nav-subitem-${subItem.id}`}
7782
>
7883
<MenuItemSubList>
7984
{subItem.icon && <SubIconWrapper>{subItem.icon}</SubIconWrapper>}

0 commit comments

Comments
 (0)