upcoming: [M3-9118] - Add the Interface Details drawer #11888
Conversation
| @@ -8,17 +8,17 @@ import type { Theme } from '@mui/material'; | |||
| export const PublicTemplateRules = () => { | |||
| return ( | |||
| <> | |||
| <Typography sx={(theme) => ({ marginTop: theme.spacing(3) })}> | |||
| <Typography sx={(theme) => ({ marginTop: theme.spacingFunction(24) })}> | |||
There was a problem hiding this comment.
This file, VPCTemplateRules, and SuccessDialog content are just spacing updates to follow the new eslint rule (figured new feature may as well be up to date)
| const location = useLocation(); | ||
| const interfaceIdFromLocation = +location.pathname.split('/').slice(-1); |
There was a problem hiding this comment.
Thoughts on this? I'm not the happiest with it but I also didn't want to touch the Linode feature's routing too much esp given time constraints for this proj - so I'm also fine with not having this for now, and revisiting for a cleaner solution later
My idea is that for Interface firewall devices, we can link to the Interface's details instead of linode/$linodeId/networking
There was a problem hiding this comment.
I think this works for now, we can create a follow-up ticket to clean this up (maybe add it to the routing refactor work?)
| return ( | ||
| Boolean(matchPath(p, { path: location.pathname })) || | ||
| location.pathname.includes(p) | ||
| ); |
There was a problem hiding this comment.
Without this change, trying to click on the Details drawer (or the upgrade dialog!) switches us back to linode/analytics
coliu-akamai
requested review from
hana-akamai,
harsh-akamai and
bnussman-akamai
and removed request for
a team
| sx={(theme) => ({ | ||
| ...chipStyles(theme), | ||
| marginLeft: 0, | ||
| })} |
There was a problem hiding this comment.
In my opinion, we shouldn't be one-off styleing chips because it will just further open us up to UI inconsistencies.
Maybe color="primary" makes the most sense here?
There was a problem hiding this comment.
Agreed. primary or info makes sense to me
I kind of liked the chip next to the actual address (as seen in the ticket screenshot), any reason why it's at the top now?
| <Typography> | ||
| <strong>Type</strong> | ||
| </Typography> | ||
| <Typography>{type}</Typography> | ||
| <Typography sx={(theme) => ({ marginTop: theme.spacingFunction(16) })}> | ||
| <strong>ID</strong> | ||
| </Typography> | ||
| <Typography>{id}</Typography> |
There was a problem hiding this comment.
Could we apply some spacing to the root Stack so that we can avoid using marginTops to maintain spacing? I think it tends to result in a slightly more maintainable result because the spacing can be defined once rather than at each section
| <Typography> | |
| <strong>Type</strong> | |
| </Typography> | |
| <Typography>{type}</Typography> | |
| <Typography sx={(theme) => ({ marginTop: theme.spacingFunction(16) })}> | |
| <strong>ID</strong> | |
| </Typography> | |
| <Typography>{id}</Typography> | |
| <Stack> | |
| <Typography> | |
| <strong>Type</strong> | |
| </Typography> | |
| <Typography>{type}</Typography> | |
| </Stack> | |
| <Stack> | |
| <Typography> | |
| <strong>ID</strong> | |
| </Typography> | |
| <Typography>{id}</Typography> | |
| </Stack> |
...sDetail/LinodeNetworking/LinodeInterfaces/InterfaceDetailsDrawer/InterfaceDetailsContent.tsx
Outdated
Show resolved
Hide resolved
|
todo: now that m3-9109 has been merged in, link to details drawer for interfaces |
Cloud Manager UI test results🔺 1 failing test on test run #9 ↗︎
Details
TroubleshootingUse this command to re-run the failing tests: pnpm cy:run -s "cypress/e2e/core/linodes/clone-linode.spec.ts" |
|||||||||||||||||
Description 📝
Adds the Interface Details drawer for Linode Interfaces
Changes 🔄
Preview 📷
How to test 🧪
Verification steps
Author Checklists
As an Author, to speed up the review process, I considered 🤔
👀 Doing a self review
❔ Our contribution guidelines
🤏 Splitting feature into small PRs
➕ Adding a changeset
🧪 Providing/improving test coverage
🔐 Removing all sensitive information from the code and PR description
🚩 Using a feature flag to protect the release
👣 Providing comprehensive reproduction steps
📑 Providing or updating our documentation
🕛 Scheduling a pair reviewing session
📱 Providing mobile support
♿ Providing accessibility support
As an Author, before moving this PR from Draft to Open, I confirmed ✅