Dynamic starting page FE #13970
Dynamic starting page FE #13970
Conversation
| <LinkContainer to={Routes.getting_started(true)}> | ||
| <MenuItem>Getting Started</MenuItem> | ||
| <LinkContainer to={Routes.welcome()}> | ||
| <MenuItem>Welcome</MenuItem> |
There was a problem hiding this comment.
I think we can remove the link, since we already redirect to the welcome page, when clicking on the logo.
In my opinion we can even remove the dropdown completely and redirect to the documentation when clicking on the icon.
There was a problem hiding this comment.
We have there Cluster Global API browser link. So I will remove just this one.
| display: block; | ||
| `; | ||
|
|
||
| const EntityItem = ({ type, title, id }: LastOpenedItem) => { |
There was a problem hiding this comment.
Since we do not pass all LastOpenedItem attributes to this component lets create a separate Props type for it.
There was a problem hiding this comment.
We do. LastOpenedItem has just 3 props
There was a problem hiding this comment.
What I mean is, the Props type definitions looks like we always provide all attributes of ListOpenedItem as props for the component. But when we add another attribute for LastOpenedItem it would not be accessible as a component prop here, even though the the type definitions say so.
There was a problem hiding this comment.
Make sense. Will fix it
| if (!lastOpened.length) return <i>There are no last opened items</i>; | ||
|
|
||
| return ( | ||
| <ListGroup data-testid="last-opened-list"> |
There was a problem hiding this comment.
A nitpick, but I think it looks nice to remove the bottom margin of these lists. We could add className="no-bm".
There was a problem hiding this comment.
We have the same margins in other part of app
There was a problem hiding this comment.
I am just saying it would look nice.
| <StyledSectionComponent title="Last opened"> | ||
| <LastOpenList /> | ||
| </StyledSectionComponent> | ||
| <StyledSectionComponent title="Pinned items"> |
There was a problem hiding this comment.
What do you think about the name "Favourites"?
"Pinned" remindes me of the data table pinning.
There was a problem hiding this comment.
This naming is in the documentation. Also, BE already uses it. But ye... Favorites sound better. Let's talk with team about that
There was a problem hiding this comment.
Sure, just a personal preference.
| &:hover { | ||
| color: ${theme.colors.variant.darker.primary}; | ||
| } | ||
| `); |
There was a problem hiding this comment.
Just a personal preference, but I can imagine that it is easier to understand, that this is a link, if we keep the default link styling.
There was a problem hiding this comment.
I made it in the same color as the relative label component.
There was a problem hiding this comment.
We had the topic of differently coloured links in the past and usually got feedback that it would look better / be easier to understand if we color links the common way. I do not think the current version looks bad. Although the default color would probably look better with the dark mode version:
graylog2-web-interface/src/components/welcome/RecentActivityList.tsx
Outdated
Show resolved
Hide resolved
graylog2-web-interface/src/components/welcome/RecentActivityList.tsx
Outdated
Show resolved
Hide resolved
| search: { link: 'SEARCH_VIEWID', typeTitle: 'search' }, | ||
| search_filter: { link: 'MY-FILTERS_DETAILS_FILTERID', typeTitle: 'search filter' }, | ||
| unknown: { typeTitle: 'unknown', link: undefined }, | ||
| }; |
There was a problem hiding this comment.
It looks like there are many entities the backend supports, which are not handled by the frontend yet.
The possible types are listed in GRNTypes.java. In other cases we use getShowRouteFromGRN to generate the link for an entity.
| const entityType = entityTypeMap[type] ?? entityTypeMap.unknown; | ||
| const entityTypeTitle = useMemo(() => { | ||
| try { | ||
| return getTitleForEntityType(type); |
There was a problem hiding this comment.
We could also add a parameter for getTitleForEntityType to define if the function should throw an error when and entity type is unknown. The parameter could be true by default.
changelog/unreleased/pr-13970.toml
Outdated
| @@ -0,0 +1,4 @@ | |||
| type = "add" | |||
| message = "Dynamic starting page FE" | |||
There was a problem hiding this comment.
Let's add a more meaningful change log, like "Replacing getting started guide with start page which lists recently opened and favorite saved searches and dashboards and recent activity."
| Last open - entities which were recently viewed. | ||
| Favorite items - entities which were added to the favorites. | ||
| Recent activity - shows all actions ( creating, updating, sharing e.t.c) which were made with all entities. | ||
| </span> |
There was a problem hiding this comment.
What do you think about displaying the description per section, below the section headline?
Regarding "last opened" and "favorite", in my opinion it makes sense to mention which entities are included in the lists. Currently it only contains saved searches and dashboards. It means we need to update the text when we extend the functionality, but I like that it gives users a clear understand of where / when the functionality is offered.
Last open
Overview of recently visited saved searches and dashboards.
Favorite items
Overview of your favorite saved searches and dashboards.
Recent activity
{if admin} This list includes all actions graylog users performed, like creating or sharing an entity.
{if non-admin user} Overview of actions you made with entities, like creating or sharing an entity.
Regarding "recent activity", it looks only an admin can see "creating", "updating" and "deleting" and anormal user just sees the activity for sharing, but I think we will change this soon.
This PR should be merged after BE. #13985
Description
In this PR we create a dynamic start page. On this page, users are able to see the most used content.
Motivation and Context
How Has This Been Tested?
To test this changes you have to wait until #13985 will be merged, or its also possible to run server from #13985 and then switch to brunch from this PR and take a look ant FE
Screenshots (if appropriate):
Types of changes
Checklist: