FrontPage design update | Improve discoverability about flyt HOT 50 CLOSED

Looking at a separate "fave" endpoint now.

from flyt.

Da har jeg et draft av migreringsscript til ny databasestruktur for å støtte dette. Innholdet er:

• Først, litt renhold - fjerning av kolonner som ikke er i bruk i modellen vår. For å gjennomføre dette vil det være slettede data på noen nivåer; det handler om <10 rows i hvert nivå jeg har undersøkt og jeg antar alle er opprettet via SQL heller enn applikasjonen. I prodnivået er det 1 påvirket row som gjelder @pagodo.
• Deling av nåværende UserAccesses i to tabeller Users og Accesses. Dette hjelper oss å holde bruker-lagringen på en god normalform.
• Introduksjon av ny tabell UserToVSM, som linker mellom Users og VSM for å holde informasjon om Favorite-funksjonen. I tillegg har den en Created-timestamp.
• Introduksjon av et nytt view UserAccesses som skal erstatte den gamle tabellen. Dette kommer som eget script da SQLMS hevder CREATE VIEW må være først i sin batch, og det avhenger av at de gamle navnene er ryddet bort før det kan kjøres.

Favorites_draft_1.zip

from flyt.

Tror vi da har all backend-funksjonalitet i gang, men det kan jo alltids finnes bugs, så jeg holder et øye med det.

from flyt.

Update since last

• Separate fav/unfav endpoint now exists on /api/v{api-version}/project/favorite/{id} (PUT favs, DELETE unfavs)
• Corrected a situation where new users could be stored multiple times, damaging data integrity wrt. favorites.
• Corrected a situation where new user access rule (sharing a VSM with someone) failed to save.
• Corrected a situation where new projects (empty or duplicates) failed to save.

from flyt.

@ntorsen The fix was updating an SQL Stored Procedure, so no deploy for this - Dev environment is updated now.

from flyt.

One last thing, we are not consistent on the naming projects vs processes. Should we stick to one, or is it fine to use both?

Was thinking the same. I think that Processses are better than Projects, but harder to pronounce. The url's (e.g. https://flyt.equinor.com/projects/475) already says project.. don't want to ruin old links, but maybe this could be fixed in a smart way too. I'll check with @askbulle about this.

from flyt.

@SjoenH I have now adressed However:

• I have changed "Projects" to "Process" everywhere except in the URL routing. I will wait to discuss this with you before redirecting.

• There is still a small bug concerning the pagination in the "All processes" page (again, the pagination bar shows even when the search returns a couple of cards).

from flyt.

Can you also please change Last created to Date created

from flyt.

@ntorsen ready for testing in Dev. https://web-vsm-dev.radix.equinor.com

What to test:

• New project URLs. We are now calling all projects for processes. But old bookmarks should still work.*
• New FrontPage & general functionality.
• Show all projects
• my processes
• my favourites pages
• ❤️ Fave & un-fave a VSM
• Search for VSM based on name & users
• Sort Processes by Last Modified, Alphabetically and by Date created
• Pagination works for all results

*On the new URLs:
Example of new URL: process/475 But old URLs likeprojects/475 should still work.

from flyt.

@ntorsen
Note, that this front-page change does not include the risk-feature #155 atm. So you might see a weird rendering like this

Apart from that, everything else should work as expected.

from flyt.

Thanks for the feedback @Linedueo. I created a new issue based on it #220
I don't consider these improvements a blocker for the release of these new features.

So instead of stopping our testing now, I'm suggesting we do these changes asap after this. We also have #159 that would need more front-end changes.
@equinor/flyt-product-owners let me know if you think different about this.

from flyt.

Thanks for testing. I don't think that is an issue. Moving this to QA now.

from flyt.

Looks good! You may release 🥳

from flyt.

This bar chart shows at which hour of day the changes has happened, that should be a good indication of when it is suitable to do this

from flyt.

QA build ready to promote after API tomorrow at 08:00.
Press here to promote QA to PROD 👈 🚀

from flyt.

Note: We are having some issues with fave-ing processes. So kinda jumped the gun on the celebration here... 😅
@Magos is looking into it now.

from flyt.

Not sure if it's a bug or intentional but I wanted to search for some processes that have P&I in the title. I did not get any results, not with "P&I" either. I guess it's the & somehow making problems? This is the same search result from the power BI report:

from flyt.

@Magos, I talked with Line. Search for a specific person should give back all project where that user has edit-access. That means an owner, admin, or contributor role.
Ref: https://www.figma.com/file/IkHwmIQrsT0iR34f5R5UnZ?node-id=2552:89145#109341051

from flyt.

@Magos, we believe that in order to faving and unfaving a project, we need a PATCH method.

Right now, we are using a POST method that expects a VSM project, where the VSM projects's ID is provided. There are two issues with that:

• We are sending the entire VSM project by faving/unfaving - if someone else were working on that project at the same time as we made the "fave" request, we would be overriding their changes.
• We cannot fave/unfave VSM projects we don't have edit access to.

from flyt.

@ntorsen Ready for testing in dev environment. https://web-vsm-dev.radix.equinor.com/
Add a comment if you find something strange. If all is good, you may promote it to QA environment and notify our POs.

from flyt.

Results from testing 29.09

from flyt.

Thanks for testing @ntorsen
Not a big thing but, I would appreciate it if next time you add the images and text directly into GitHub so that it is easier to read and respond to your feedback 😄

Search for name & users:

Able to search for username (such as ntor, magsa, etc) and name of project.

• Are we going to add an option to search for a specific person where you type in first name/last name. Maybe it will come in handy if you don't know the username?

Yes, but full-name-search is dependent upon #148. Let's add it later. We only support short-name-search for now.

Alphabetically:

Why does Untitled VSM come first up for 'All projects'?

We display your own Untitled processes, but should hide other people's Untitled processes. Let me know if it doesn't follow this rule. :)

Should it come here at all? I was expecting it to only land on 'My projects".

The section is all projects, not everyone else's projects. So I think it makes sense to show your projects in line with the other's?

Search

If it exists an Untitled VSM for All projects, why am I not able to search for it? Tried both searching for Untitled and VSM

Any Untitled VSM does not have a given name, thus it is untitled or rather not set in the back-end. But you make a valid point that searching for Untitled VSMs might come in handy. 🤔

Deleting a vsm

Responding "weirdly" when I try to delete a vsm (both from favorites and all projects):

Nice catch! 💪 @Magos could you have a look at this? Summary: We have a conflict when trying to delete a project that is faved.

It should take me to the Main page after deleting it, but now I get "An error occurred on client, and problems with logging me in when clicking on 'Flyt' on the left-hand side.

Yes, would be covered by the deleting a favourite VSM bug-fix.

from flyt.

We display your own Untitled processes, but should hide other people's Untitled processes. Let me know if it doesn't follow this rule. :)

Yes, it follows this rule 👍 However I get other people's duplicate of untitled vsm. Is this an exception to rule? @SjoenH

The section is all projects, not everyone else's projects. So I think it makes sense to show your projects in line with the other's?
Yes that makes sense 💯

from flyt.

Yes, it follows this rule 👍 However I get other people's duplicate of untitled vsm. Is this an exception to rule?

Yes. I don't think it will be a common thing people will do in prod. 🤔 Let's do something about it if it becomes a problem.

from flyt.

@Magos will you let me know when the fix for deleting vsm is put in?

from flyt.

Change message 500 for deleted projects @Magos

from flyt.

@ntorsen @Sjoen 404 response for nonexistent project is now deployed to Dev.

from flyt.

Looking good 👍
I'm promoting DEV into QA

from flyt.

@equinor/flyt-product-owners This is now ready for Testing in QA enviroment. https://web-vsm-qa.radix.equinor.com

Let us know if you have any concerns. If not, we will prepare for a release.
@Magos we will need to look into a good timing for release to Production. Expected downtime approx 10 minutes.

from flyt.

I have tested the QA version, nice improvements! Do have some comments:

• The search bar should be available in all screens (all projects, your projects, your favourite projects), the separate search page is not needed
• When many participants are active in one project, the icons looks a bit weird. Is it possible to this any cleaner? E.g. having the owner as a separate, then stacking admins and collaborators or something? I guess the layout of the cards will have to change with #159 , so could be adressed there.
• Both in Edge and Chrome there is an issue with the width of the site, it leaves room for scrolling sideways 0.5 cm.. This shows on all pages except for the favourite page.
• Discrepencies between the title of the pages and the text when hovering the side bar: "My projects" vs "Your projects" and "Favourite" vs "Your favourite projects"
• In the Figma design, the search bar had additional functionality, like searching for several things, is this a separate issue now for future dev?

from flyt.

@knudsvik thanks for the feedback.

• The search bar should be available in all screens (all projects, your projects, your favourite projects), the separate search page is not needed

OK, then the search would be affected by your choice in the left-navbar. All projects + search would give the same as the search-page atm.

• When many participants are active in one project, the icons looks a bit weird. Is it possible to this any cleaner? E.g. having the owner as a separate, then stacking admins and collaborators or something? I guess the layout of the cards will have to change with Project labels #159 , so could be adressed there.

Yes, I see your point. @Linedueo could you keep this in mind when doing #159 ? Also, I think the cards are a bit short with the new design. If, for instance, you have a long title, it will now be cut off really early...

• Both in Edge and Chrome there is an issue with the width of the site, it leaves room for scrolling sideways 0.5 cm.. This shows on all pages except for the favourite page.

@martabenthem please change front-page container styling to

width: calc(100% - 70px);
padding-left: 70px;

• Discrepencies between the title of the pages and the text when hovering the side bar: "My projects" vs "Your projects" and "Favourite" vs "Your favourite projects"

@martabenthem Please make it follow EDS guidelines ref https://github.com/equinor/design-system/blob/documentation/apps/storefront/docs/guidelines/accessibility/overview.mdx#call-to-actions

• In the Figma design, the search bar had additional functionality, like searching for several things, is this a separate issue now for future dev?

Right now, the search support short names of people with access to a process and the process title. We could probably make this more intuitive. @Linedueo
For full-name search, we are still waiting on #148.

One last thing, we are not consistent on the naming projects vs processes. Should we stick to one, or is it fine to use both?

from flyt.

@askbulle : definitivt Processes! Good catch.

@SjoenH: is it possible to update the URL's to show https://flyt.equinor.com/process/475 at the same time? But still have the old links like https://flyt.equinor.com/projects/475 working?

from flyt.

@knudsvik

1. OK, changing to processes (ping @martabenthem)
2. Yes, I think so. I'll look into setting up a redirect for /project into /process.

from flyt.

@knudsvik that can be done! I guess also Last modified to Date modified?

Update: No, keep it as last modified

from flyt.

Right now, we only show ~15 processes on the front-page. This looks fine most of the time.
But we could calculate how many we can show (height and width) and display as many as possible on a page. #218

@knudsvik Let us know if this should be fixed before we release or if it is not prioritized. Created an issue for it, so we may do it later.

Update: Let's do it when we do the frontpage changes for #159

from flyt.

@SjoenH Front page design justeringer- venstre justert search bar og tittel, flush med cards. searchbar og tittel flyter litt nå. cards skal være venstrestilt og ikke sentrert. Pagination skal være høyrestilt. Det hadde også vært fint og fått sentrert logo over ikoner i left nav. Vi bruker grønn logo. Det er også fryktelig mye spacing mellom logo og navn.

from flyt.

Se figma skisser

from flyt.

Testing went good 🥇 :

• Something that maybe is worth mentioning is that when you either delete or duplicate a process from 'My favorites' or 'My processes' you will automatically land on 'All processes'. So it its set as a default to land on this page when doing these alterations. Is this something worth looking into in the future?
  @equinor/flyt-developers

To me this can be moved to QA environment.

from flyt.

@knudsvik & @askbulle 🚀
Ready for UAT in QA-environment: https://web-vsm-qa.radix.equinor.com/

from flyt.

Talking about releasing this...
There are no breaking changes if the back-end is updated before the front-end. But there will be some downtime on the prod API. Estimated to 10 minutes.

@knudsvik Thinking about finding a good time for releasing. Do you have any input on this?

Release steps

Back-end

• Turn off API service
• run database update scripts
• start production env deploy
• start API service
• Verify and Notify about ready for front-end-release.

Front-end

• Promote QA-env to prod. 3 minutes.

from flyt.

I suggest releasing at 08:00 tomorrow 7. Oct.

I suggest at 8 tomorrow. Which is still quite early with not that much activity.
If this is ok with you: - It would be nice to inform the users about some downtime. What is the best channel for this? Could you @knudsvik relay the message? :)

For future changes:

We probably should think about adding some service-message banner so that we can schedule downtime etc: #224
This is something we have for our other apps in the team, so shouldn't take too long to implement.

Notes about that graph

Correct me if I'm wrong. Trying to wrap my head around this... 😅

This graph is considering all the pkChangeLog items, and does not necessarily mean that we get a lot of changes every day in that timeframe. It could just be a lot of changes done in that time on one day... 🤔 Anyway, I agree that it probably is a good indication on when the tool is used overall.

We took a look in the DB ourselves and noted that the above is in UTC time. So add 2 hours for Norway.
The ideal times for downtime are [...,08:00] or [17:00, 20:00] or [22:00,...], but that is outside our Workday... (Kjernetid 9→15)

from flyt.

Good catch with the UTC! These are the sum of pkChangeLog items, not an average so it could probably improve. But still at good indication of when it is used. We don't have a proper channel to communicate it in, hence I like the #224 . Just release it asap tomorrow morning!

from flyt.

Super. 💪 Will do 🚀

from flyt.

API release in progress.

from flyt.

API and Front-end is now released. Took around 12 minutes. 🎉
Note, we experienced some slowness in the initial requests after deploy. Seems to be picking up some speed now after running some requests. @Magos let's keep an eye on it. 💪

from flyt.

Searching for hsjo returns all my processes.

But adding another query parameter does not give us the expected result.

from flyt.

Fave-ing processes was fixed at 09:25. 💪 Thanks @Magos & @pagodo

--
In our API-release-pipeline (devops); APIM (API-Management) should be updated with the new swagger definition. But seems like there is some caching here, which may lead to APIM using a cached file instead of the new we provide. 🌴
We should look into this and improve that release-step @equinor/mad-backend

from flyt.

@SjoenH vet denne er ferdig- men hvis dere ser i forhold til grid i figma så begynner innholdet på siden to kolonner inn. Nå blir innholdet veldig tett opp imot left nav og ut på sidene. Spesielt på store skjermer så vil dette se rart ut. Oppsettet trenger luft- da blir det enklere for brukeren å prosessere innholdet...og det er visuelt finere.

from flyt.

@Linedueo Godt poeng! Hvordan endres griden mtp. andre skjerm-størrelser? Små vs store skjermer.
Og hvordan vil dette se ut på en mobil? ref #262

from flyt.

@SjoenH jeg kan kjapt sette opp for ipad og mobil men griden vil se ut slik

:

from flyt.