Closed jsheunis closed 3 months ago
Whenever a catalog page is opened in a new tab/window in a browser, or when it's refreshed, the Vue app instance is created: https://github.com/datalad/datalad-catalog/blob/main/datalad_catalog/catalog/assets/app.js. This happens irrespective of whether the URL contains parameters or not.
Apart from setting up the basic content of the outer wrapper of the catalog (logo, social links, etc) from a configuration file, this Vue app instance also specifies inclusion of the router
instance, which is specified and instantiated here: https://github.com/datalad/datalad-catalog/blob/main/datalad_catalog/catalog/assets/app_router.js
Subsequently, the router
handles navigation.
http://mycatalog.com
by entering that URL into a browserhome
route from the URL (there are no parameters), and navigates to itbeforeEnter()
of home
route:
./metadata/super.json
dataset_id
and dataset_version
NOT available from that file, navigate to 404 page -->
router.push({ name: "404" })
dataset_id
and dataset_version
available, navigate to dataset page (which has an associated component) -->
router.push({
name: "dataset",
params: {
dataset_id: superds["dataset_id"],
dataset_version: superds["dataset_version"],
},
});
dataset
route, which creates the datasetView
component and its children and then calls async created()
of this component, which does the following:
dataset_id
and dataset_version
and then access its metadata file (unavailable file results in router.push({ name: "404" })
)setCorrectTab()
home
route is never actually entered, because it navigates to the dataset
route or 404
route inside of beforeEnter()
navigation guarddataset
route will always have parameters dataset_id
and dataset_version
dataset_ready
, subdatasets_ready
and files_ready
be set (since these variables are being watch
ed).setCorrectTab()
from watcher?These docs should take the redesign with aliases and concept-id implemented in https://github.com/datalad/datalad-catalog/pull/430 into account.
We need a thorough description of how navigation (URL- and user-based) works in the catalog. It is completely undescribed at the moment and would need someone to be very well versed in VueJS and Vue Router if they want to contribute to the code.
Below is the first attempt. It should ultimately find its way into the docs.