[WIP] Dynamic island - #2239
[WIP] Dynamic island#2239frozenprocess wants to merge 2 commits into
Conversation
✅ Deploy Preview for calico-docs-preview-next ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
✅ Deploy Preview succeeded!Built without sensitive environment variables
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
Certainly looks cool, but I'm not sure it fits with our documentation pages. Would be happy to hear more about what you're plans are with this. |
|
I’ve prepared a template to ensure that stakeholders who requested this can see their vision brought to life before we proceed with meetings and approvals. |
| <CardBody flex="1" p={{ base: 4, md: 6 }} h="100%" display="flex" flexDirection="column" justifyContent="center"> | ||
| <Flex direction="column" h="100%" justify="space-between"> | ||
| <Box> | ||
| <Heading _firstLetter={{ textTransform: "uppercase" }} |
There was a problem hiding this comment.
Because you're using a heading, this is showing in the TOC. Not sure if you meant that? @ctauchen
| <CardBody flex="1" p={{ base: 4, md: 6 }} h="100%" display="flex" flexDirection="column" justifyContent="center"> | ||
| <Flex direction="column" h="100%" justify="space-between"> | ||
| <Box> | ||
| <Heading _firstLetter={{ textTransform: "uppercase" }} |
There was a problem hiding this comment.
Do you really need to use textTransform: "uppercase". Your content is static and can be controlled from the data.
| messageId?: string; | ||
| } | ||
|
|
||
|
|
There was a problem hiding this comment.
make sure you format this file
| const ProductAdvocate: React.FC<ProductAdvocateProps> = ({ messageId, ...rest }) => { | ||
|
|
||
| // Select message based on messageId or randomly if not provided | ||
| const [selectedMessage] = React.useState(() => { |
There was a problem hiding this comment.
You don't need to use state here. Just assign it to a variable
const selectedMessage = advocacyMessages.find(msg => msg.id === messageId ?? fallbackId);
Or better yet, use an object instead of an array
const selectedMessage = advocacyMessages[messageId ?? fallbackId];
You could create a type from your message ids and use that in your props for better typing
|
Closing this following discussion and agreement on another path. |
3 participants
This adds a small Dynamic Island component to the site.
Product Version(s):
Issue:
Link to docs preview:
SME review:
DOCS review:
Additional information:
Merge checklist: