Initialize Provider store data, UI store and flags store from cookies in a plugin

[obulat]

Fixes

Fixes #4230 by @obulat

Description

One of the main purposes of this PR is to remove the ssrRef from the provider store because it's not available in Nuxt 3. While removing that, I also wanted to simplify the code we run on each page navigation by moving what's possible to the app start on the server (the init-stores plugin).

This PR adds an init-stores plugin that initializes the store state at the app's start, instead of sometimes doing it at every page navigation in middleware.

Now, all of the initFromCookies calls (for the UI store and the flags store) are done in the init-stores plugin. The flags store's initFromQuery is still called from the middleware in case the query changes between requests.

This plugin also initializes the providers' data. ~~It also keeps track of the date when the providers were updated and if more than 60 minutes have passed since the last update, refetches the provider data. This is the way we implemented this before, but I'm not sure if it's necessary: I don't think we have users that stay on the site for longer than 60 minutes without refreshing the page. Once you refresh the page, the init-stores plugin runs and you get the up-to-date provider data anyways. @zackkrida, do you think we should still keep the update-if-60-minutes-passed functionality for provider data?~~ The providers data is initialized once per request, instead of updating it every 60 minutes.

Some of the data that was saved in env property in nuxt.config was moved to publicRuntimeConfig as env is not used in Nuxt 3.

Update

This PR also adds the sourceName and providerName properties to the media item when the item is fetched (for single item and the search results) instead of when it's requested. This allows to simplify code using the media: we no longer need to call the provider store in component or _addProviderName in the single result store.

To fix the Playwright tests in this PR, I also had to update the stats tape, split the cookies that are saved in preparePageForTests between the features and sessionFeatures (e.g. fetch_sensitive) cookies, and add waits to some of the tests that were taking the snapshots before the page rendered.

Testing Instructions

The app should work as expected; there should be no changes. There will be no calls to initFromCookies (ui store and flags store), but you would have to add a log in the app to see that.

The CI should pass, too.

Checklist

• [ ] My pull request has a descriptive title (not a vague title likeUpdate index.md).
• [ ] My pull request targets the default branch of the repository (main) or a parent feature branch.
• [ ] My commit messages follow best practices.
• [ ] My code follows the established code style of the repository.
• [ ] I added or updated tests for the changes I made (if applicable).
• [ ] I added or updated documentation (if applicable).
• [ ] I tried running the project locally and verified that there are no visible errors.
• [ ] I ran the DAG documentation generator (if applicable).

Developer Certificate of Origin

Developer Certificate of Origin

Developer Certificate of Origin
Version 1.1

Copyright (C) 2004, 2006 The Linux Foundation and its contributors.
1 Letterman Drive
Suite D4700
San Francisco, CA, 94129

Everyone is permitted to copy and distribute verbatim copies of this
license document, but changing it is not allowed.


Developer's Certificate of Origin 1.1

By making a contribution to this project, I certify that:

(a) The contribution was created in whole or in part by me and I
    have the right to submit it under the open source license
    indicated in the file; or

(b) The contribution is based upon previous work that, to the best
    of my knowledge, is covered under an appropriate open source
    license and I have the right under that license to submit that
    work with modifications, whether created in whole or in part
    by me, under the same open source license (unless I am
    permitted to submit under a different license), as indicated
    in the file; or

(c) The contribution was provided directly to me by some other
    person who certified (a), (b) or (c) and I have not modified
    it.

(d) I understand and agree that this project and the contribution
    are public and that a record of the contribution (including all
    personal information I submit with it, including my sign-off) is
    maintained indefinitely and may be redistributed consistent with
    this project or the open source license(s) involved.

[github-actions[bot]]

Full-stack documentation: https://docs.openverse.org/_preview/4231

Please note that GitHub pages takes a little time to deploy newly pushed code, if the links above don't work or you see old versions, wait 5 minutes and try again.

You can check the GitHub pages deployment action list to see the current status of the deployments.

New files :heavy_plus_sign::

• https://docs.openverse.org/_preview/4231/changelogs/api/2024.05.06.19.44.35.html

Changed files :arrows_counterclockwise::

• https://docs.openverse.org/_preview/4231/meta/media_properties/frontend.html

[obulat]

Thank you for confirming my thoughts that we only need to fetch providers once per SPA load, and for giving more context.

If getProviders was updated to something like the following, all the additional complexity of "fetch if needed" can be removed without changing a single thing about the current performance or request frequency of the providers list:

There are several calls for provider store functions. We would need to update all of them, which will require making them async and adding the necessary related changes. I would prefer to add fewer changes: only fetch the data in the plugin.

[sarayourfriend]

only fetch the data in the plugin.

Makes sense to me!

[obulat]

The test changes introduced seem like they must have been frustrating to have to write! Do you have a sense of why thy were introduced in this PR? I am curious because I would expect these changes to not alter page rendering timing, or make them a bit faster if it did.

They were! :) I'm not sure about the reason, but I think that the page rendering became faster, so the assets and images don't get enough time to render now.