Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Roadmap table #2051

Merged
merged 5 commits into from
Dec 19, 2023
Merged

Add Roadmap table #2051

merged 5 commits into from
Dec 19, 2023

Conversation

jordankoschei-okta
Copy link
Contributor

@jordankoschei-okta jordankoschei-okta commented Nov 30, 2023

As discussed with Hannah, we've decided the best way to provide a Roadmap table with all the needed features is to create it using our own DataTable component and then embed it in Supernova.

This PR adds a Roadmap page to the Storybook sidebar, and outputs a table that can be embedded in Supernova too.

Todo:

  • Finalize the columns and dates
  • Confirm why the linter needed to move @okta/odyssey-design-tokens and @storybook/theming out of devDependencies and into dependencies in the Storybook package.json

Copy link
Contributor

@chrispulsinelli-okta chrispulsinelli-okta left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Left you some suggestions for this PR, but also leaving an approval to not block you.


function parseCustomDate(dateStr: string): Date {
if (dateStr.length <= 0) {
return new Date(2999, 0);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Curious what this is for?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For readability, the dates are presented as "Oct '22", "Nov '23", etc. The default sorting function handles these alphabetically, which leads to an incorrect order, so this function makes it behave as expected.

In a future rewrite I'd probably store the dates as true Dates and then render them in the desired format, but for now I'll leave it as-is.

aValue = parseCustomDate(aValue);
bValue = parseCustomDate(bValue);

console.log(aValue, bValue);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Need this?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nope, good catch!

Comment on lines +35 to +44
const severity =
value === "Fully released"
? "success"
: value === "In Labs"
? "warning"
: value === "In progress"
? "default"
: value === "Not started"
? "error"
: "default";
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This would be better as a switch block.

Comment on lines +51 to +53
Cell: ({ cell }) => {
return cell.getValue() ? cell.getValue() : "—";
},
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A lot of repeated code below... perhaps extract this function out to a variable for reuse?

@jordankoschei-okta jordankoschei-okta merged commit e3a2a6e into main Dec 19, 2023
1 check failed
@jordankoschei-okta jordankoschei-okta deleted the jk/roadmap-in-storybook branch December 19, 2023 18:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants