Make page title configurable

adswa commented

2025-05-08 08:04:29 +00:00

(Migrated from github.com)

This could be a very stupid way to do this, because I have no idea how to actually do this correctly. But locally, this is a way with which I can make the title configurable. Very happy to learn how to do this well :)

jsheunis commented

2025-05-08 14:47:51 +00:00

(Migrated from github.com)

Thanks @adswa. This is actually a neat way of doing it, circumventing VueJS which is not necessarily a bad thing. Before I merge:

I want to check if there is indeed a VueJS-specific way of inserting data into the html document head. I vaguely recall something to do with VueJS meta tag handling, but I am not certain right now.
I think it would be good to add some fall backs in case the fetch call throws an error or in case the config does not contain
IIRC the file path can also be provided without the /public part, since the build+deployed version of the application will have all files that were in /public at the root level. Worth testing first, though.

I will report back once I've checked the first one.

UPDATE:

I found https://github.com/vueuse/head, but it feels unnecessary to introduce a dependency for such a minor update.
Similar things were done in datalad-catalog, see: github.com/datalad/datalad-catalog@c911350089/datalad_catalog/catalog/assets/app_component_dataset.js (L310-L349)

Thanks @adswa. This is actually a neat way of doing it, circumventing VueJS which is not necessarily a bad thing. Before I merge: - I want to check if there is indeed a VueJS-specific way of inserting data into the html document `head`. I vaguely recall something to do with VueJS meta tag handling, but I am not certain right now. - I think it would be good to add some fall backs in case the `fetch` call throws an error or in case the config does not contain - IIRC the file path can also be provided without the `/public` part, since the build+deployed version of the application will have all files that were in `/public` at the root level. Worth testing first, though. I will report back once I've checked the first one. UPDATE: - I found https://github.com/vueuse/head, but it feels unnecessary to introduce a dependency for such a minor update. - Similar things were done in `datalad-catalog`, see: https://github.com/datalad/datalad-catalog/blob/c911350089617e47fd480b443b9869a830e5a1f2/datalad_catalog/catalog/assets/app_component_dataset.js#L310-L349

adswa commented

2025-05-09 16:39:07 +00:00

(Migrated from github.com)

Stephan, its terrible, you motivated me to try to write JavaScript with absolutely no knowledge :D I do not want to disclose how long it took me to write the very likely extremely bad lines I just committed. I added a fallback if page_title isn't defined to use the app_name, and to use welcome to shacl-vue as a last resort. Happy to learn how to improve this!

Stephan, its terrible, you motivated me to *try* to write JavaScript with absolutely no knowledge :D I do not want to disclose how long it took me to write the very likely extremely bad lines I just committed. I added a fallback if page_title isn't defined to use the app_name, and to use welcome to shacl-vue as a last resort. Happy to learn how to improve this!

😆 1

jsheunis commented

2025-05-12 08:46:57 +00:00

(Migrated from github.com)

It's not terrible at all, seriously. I think we should use pretty much exactly that code, but then just move it to a separate place, possibly in App.vue, then assign the value of the document title from there. Just need to check whether this would be assigned semi-immediately when the page is loaded or whether it's delayed by some other fetch/load operations (which would be a reason not to follow my suggestion).

jsheunis commented

2025-05-21 09:15:35 +00:00

(Migrated from github.com)

@adswa I moved your logic to the place where config was already processed. Thanks!

❤️ 1 🚀 1

Rows
Columns

Make page title configurable #106