[BUG] "Layout" and "Item Size" buttons don't work

[dtypo]

Environment

Self-Hosted (Docker)

Version

2.0.8

Describe the problem

I can't use the 6 buttons labeled "Layout" and "Item Size" to change the appearance of my dashboard.
The buttons regularly works visiting the demo here: https://demo.dashy.to/
The buttons start working if I enter the "Interactive editor" (the small pencil) and then click on "Cancel edit".
The same happens with 4 different browsers (Chrome desktop, Edge desktop, Opera desktop, Chrome mobile on Android).

My config.yml:

pageInfo:
    title: MyLab
    navLinks:
        - title: Home
          path: /
        - title: My Domain
          path: https://...
        - title: Router
          path: https://...
    footerText: 
appConfig:
    language: en
    defaultOpeningMethod: 'newtab'
    enableErrorReporting: true
    preventWriteToDisk: true
    appConfig.preventLocalSave: true
    theme: one-dark
    #colCount: 6
    webSearch:
        searchEngine: 'google'
        searchBangs:
            /r: reddit
            /w: wikipedia
            /a: https://www.amazon.it/s?k=
    auth: 
        users:
            - user: 123
              hash: 123
              type: admin
        enableGuestAccess: true  
sections:
    - name: Synology Native [Web]
      displayData:
          sortBy: 'default'
      items :
        - title: DS
          icon: nas.png
          url: https://...
          target: newtab
        - title: Surveillance Station
          icon: surveillance_station.png
          url: https://
          target: newtab
        - title: Photos
          icon: synology_photos.png
          url: https://...
          target: newtab
        - title: Video Station
          icon: video_station.png
          url: https://...
          target: newtab
    - name: Management
      items:
        - title: Portainer
          icon: portainer.png
          url: https://...
        - title: Glances
          icon: glances.png
          url: https://...
        - title: Putty
          icon: putty.png
          url: https://...
        - title: Filezilla
          icon: filezilla.png
          url: https://... 

My docker-compose.yml:

dashy:
        image: lissy93/dashy
        container_name: dashy
        volumes:
            - /volume1/docker/dashy/config.yml:/app/public/conf.yml
            - /volume1/docker/dashy/item-icons:/app/public/item-icons
        ports:
            - 4000:80
        security_opt:
          - no-new-privileges:true
        cap_drop:
            - ALL
        cap_add:
            - CHOWN
            - SETGID
            - SETUID
            - DAC_OVERRIDE
            - NET_BIND_SERVICE
        networks:
            traefik_proxy:
                ipv4_address: 192.168.xxx.xxx # You can specify a static IP
        environment:
            - NODE_ENV=production
            - UID=${PUID}
            - GID=${PGID}
        restart: unless-stopped
        healthcheck:
            test: ['CMD', 'node', '/app/services/healthcheck']
            interval: 1m30s
            timeout: 10s
            retries: 3
            start_period: 40s 

I tried both with and without preventWriteToDisk: true and appConfig.preventLocalSave: true.
Nothing changes.

Additional info

The log:

 WAIT  Compiling...3:16:11 PM
yarn run v1.22.15
$ npm-run-all --parallel build-watch start
$ vue-cli-service build --watch --mode production
$ node server
Checking config file against schema...
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
  Warning: 2 issues found in config file  
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
1. /pageInfo/footerText must be string 
2. /appConfig must NOT have additional properties (appConfig.preventLocalSave)
SSL Not Enabled: Public key not present
 ██████╗  █████╗ ███████╗██╗  ██╗██╗   ██╗
 ██╔══██╗██╔══██╗██╔════╝██║  ██║╚██╗ ██╔╝
 ██║  ██║███████║███████╗███████║ ╚████╔╝
 ██║  ██║██╔══██║╚════██║██╔══██║  ╚██╔╝
 ██████╔╝██║  ██║███████║██║  ██║   ██║
 ╚═════╝ ╚═╝  ╚═╝╚══════╝╚═╝  ╚═╝   ╚═╝
*******************************************************************************************
Welcome to Dashy! 🚀
Your new dashboard is now up and running with Docker
*******************************************************************************************
Using Dashy V-2.0.8. Update Check Complete
✅ Dashy is Up-to-Date
-  Building for production...
 WARN  A new version of sass-loader is available. Please upgrade for best experience.
 WARNING  Compiled with 2 warnings3:17:24 PM
 warning  
asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets: 
  fonts/Raleway-Variable.3b5635ac.ttf (302 KiB)
  js/chunk-vendors.bbcfcf7a.js (5.54 MiB)
  js/dashy.86764f4b.js (473 KiB)
  item-icons/jdownloader.png (292 KiB)
  item-icons/traefik.png (258 KiB)
  web-icons/screenshots/dashy-scrsht-1.png (367 KiB)
  web-icons/windows10/LargeTile.scale-400.png (307 KiB)
  web-icons/windows10/SplashScreen.scale-400.png (307 KiB)
 warning  
entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
�
Entrypoints:
  dashy (6.24 MiB)
      css/chunk-vendors.d8067ad8.css
      js/chunk-vendors.bbcfcf7a.js
      css/dashy.74fa274e.css
      js/dashy.86764f4b.js
  File                                      Size             Gzipped
  dist/js/chunk-vendors.bbcfcf7a.js         5677.65 KiB      1982.44 KiB
  dist/js/dashy.86764f4b.js                 472.73 KiB       141.93 KiB
  dist/js/chunk-50f31ec3.6a39d763.js        78.19 KiB        19.21 KiB
  dist/precache-manifest.aee4007d3459d65    34.36 KiB        7.12 KiB
  05e5014783d6f4598.js
  dist/js/chunk-db28ba52.fc40b4b6.js        13.07 KiB        4.39 KiB
  dist/js/chunk-2af23fa2.aa188692.js        9.08 KiB         3.61 KiB
  dist/js/chunk-00c7add2.452da3f8.js        9.00 KiB         3.55 KiB
  dist/js/chunk-57406a58.dd2ba367.js        7.60 KiB         2.85 KiB
  dist/js/chunk-5d3daeec.790c499d.js        7.43 KiB         2.61 KiB
  dist/js/chunk-1f052e8f.48690559.js        7.12 KiB         2.54 KiB
  dist/js/chunk-614a52cf.557aa99b.js        6.89 KiB         2.66 KiB
  dist/js/chunk-c09b24c2.591e92e9.js        6.27 KiB         2.53 KiB
  dist/js/chunk-7bd8fc6c.f245ca51.js        5.91 KiB         2.43 KiB
  dist/js/chunk-2bf05644.64ceee25.js        5.78 KiB         1.98 KiB
  dist/js/chunk-ee1427b4.47a8af06.js        5.63 KiB         2.24 KiB
  dist/js/chunk-1421ee6e.979cb896.js        5.46 KiB         2.36 KiB
  dist/js/chunk-5b26620e.f21ccc1c.js        5.39 KiB         2.33 KiB
  dist/js/chunk-37cbe1cc.58b156d1.js        5.10 KiB         2.06 KiB
  dist/js/chunk-3e4858c8.6e4dc90d.js        5.08 KiB         2.14 KiB
  dist/js/chunk-4ae56f14.df8eb08f.js        4.82 KiB         2.09 KiB
  dist/js/chunk-2a54cb84.35e54a80.js        4.71 KiB         2.04 KiB
  dist/js/chunk-20617cc5.1b867d3e.js        4.67 KiB         2.01 KiB
  dist/js/chunk-519b296d.06d85dd1.js        4.67 KiB         1.95 KiB
  dist/js/chunk-0b83a9c0.6d9bf1b0.js        4.61 KiB         2.13 KiB
  dist/js/chunk-6642b5fb.172690a3.js        4.57 KiB         1.96 KiB
  dist/js/chunk-36fb5c32.22616707.js        4.50 KiB         2.00 KiB
  dist/js/chunk-1891248e.0fdb96f6.js        4.41 KiB         1.99 KiB
  dist/js/chunk-2ee06ca8.50e3a917.js        4.33 KiB         1.95 KiB
  dist/js/chunk-0eec46d7.16666778.js        4.24 KiB         1.90 KiB
  dist/js/chunk-c7e481b2.d555ce24.js        4.13 KiB         1.90 KiB
  dist/js/chunk-3df90975.c931023c.js        4.08 KiB         1.92 KiB
  dist/js/chunk-670b2b86.14a4a8ea.js        4.08 KiB         1.88 KiB
  dist/js/chunk-347afe35.ea753158.js        4.04 KiB         1.41 KiB
  dist/js/chunk-0720b856.41cc0d04.js        4.01 KiB         1.80 KiB
  dist/js/chunk-836a18b0.6ea675cd.js        3.98 KiB         1.73 KiB
  dist/js/chunk-b9c87810.de0f9a6e.js        3.93 KiB         1.67 KiB
  dist/js/chunk-3529e93a.67c958f4.js        3.89 KiB         1.74 KiB
  dist/js/chunk-0ecb0016.f20c6362.js        3.83 KiB         1.59 KiB
  dist/js/chunk-665346fe.5d58dca9.js        3.73 KiB         1.55 KiB
  dist/js/chunk-20fd6e9e.8d696cd4.js        3.69 KiB         1.73 KiB
  dist/js/chunk-61d4bc1a.c2f8fbd3.js        3.65 KiB         1.74 KiB
  dist/js/chunk-897867a6.bf085227.js        3.60 KiB         1.70 KiB
  dist/js/chunk-93e7ea42.4dab65a6.js        3.58 KiB         1.65 KiB
  dist/js/chunk-970bec2e.bdb5d5f4.js        3.48 KiB         1.47 KiB
  dist/js/chunk-7e53ad86.876c18d3.js        3.39 KiB         1.55 KiB
  dist/js/chunk-e80d132e.d7105eca.js        3.29 KiB         1.49 KiB
  dist/js/chunk-e93eb2f0.982096ee.js        3.10 KiB         1.50 KiB
  dist/js/chunk-82ef841e.8d7db77b.js        2.87 KiB         1.40 KiB
  dist/js/chunk-1ec1b1aa.14f4137a.js        2.57 KiB         1.33 KiB
  dist/js/chunk-715d1128.8d2bd179.js        2.55 KiB         1.28 KiB
  dist/js/chunk-4b6e01c6.d1a2e674.js        2.49 KiB         1.27 KiB
  dist/js/chunk-48dc0af1.715a0a24.js        2.47 KiB         1.28 KiB
  dist/js/chunk-b8d94e6a.2cf026fc.js        2.47 KiB         1.24 KiB
  dist/js/chunk-91f9933a.15173167.js        2.40 KiB         1.20 KiB
  dist/js/chunk-3190e50d.6f4f814c.js        2.09 KiB         1.07 KiB
  dist/js/chunk-1c683ba0.0814f8ca.js        2.05 KiB         1.04 KiB
  dist/js/chunk-4469b1ce.78c95fef.js        2.02 KiB         1.08 KiB
  dist/js/chunk-29a55678.bcb6ffe7.js        1.94 KiB         1.04 KiB
  dist/js/chunk-a08d5c64.8c698bb4.js        1.73 KiB         0.97 KiB
  dist/js/chunk-71fd7141.c296053c.js        1.72 KiB         0.97 KiB
  dist/js/chunk-aeec6e38.ca7c2f5a.js        1.72 KiB         0.93 KiB
  dist/js/chunk-2d225b78.a4842f97.js        1.66 KiB         0.95 KiB
  dist/js/chunk-724820ea.2b14793f.js        1.07 KiB         0.58 KiB
  dist/service-worker.js                    1.04 KiB         0.61 KiB
  dist/js/chunk-687a978c.cb0ab452.js        0.74 KiB         0.46 KiB
  dist/css/dashy.74fa274e.css               240.02 KiB       29.76 KiB
  dist/css/chunk-614a52cf.939b73a3.css      11.55 KiB        1.75 KiB
  dist/css/chunk-db28ba52.b36f6357.css      9.51 KiB         1.83 KiB
  dist/css/chunk-1f052e8f.67c1564c.css      7.27 KiB         1.31 KiB
  dist/css/chunk-2bf05644.262be67e.css      5.86 KiB         1.01 KiB
  dist/css/chunk-5b26620e.69eb85c5.css      3.98 KiB         0.96 KiB
  dist/css/chunk-3e4858c8.b5c655e8.css      3.78 KiB         0.69 KiB
  dist/css/chunk-724820ea.8e5b7c8e.css      3.78 KiB         0.92 KiB
  dist/css/chunk-5d3daeec.0adbc3b9.css      3.48 KiB         0.77 KiB
  dist/css/chunk-2a54cb84.88de65fe.css      3.31 KiB         0.87 KiB
  dist/css/chunk-vendors.d8067ad8.css       2.74 KiB         0.83 KiB
  dist/css/chunk-519b296d.04b75e3f.css      2.67 KiB         0.59 KiB
  dist/css/chunk-4ae56f14.9e53f5b9.css      2.48 KiB         0.57 KiB
  dist/css/chunk-970bec2e.12a3e19f.css      2.38 KiB         0.58 KiB
  dist/css/chunk-c09b24c2.8da9709e.css      2.30 KiB         0.56 KiB
  dist/css/chunk-347afe35.38b3bad4.css      2.03 KiB         0.57 KiB
  dist/css/chunk-57406a58.3028f684.css      1.97 KiB         0.57 KiB
  dist/loading-screen.css                   1.93 KiB         0.65 KiB
  dist/css/chunk-6642b5fb.5d01068d.css      1.86 KiB         0.50 KiB
  dist/css/chunk-7bd8fc6c.b52fb94b.css      1.83 KiB         0.52 KiB
  dist/css/chunk-00c7add2.27b39145.css      1.78 KiB         0.53 KiB
  dist/css/chunk-2af23fa2.8d0a72a5.css      1.78 KiB         0.53 KiB
  dist/css/chunk-37cbe1cc.3616cdf2.css      1.70 KiB         0.49 KiB
  dist/css/chunk-91f9933a.3e780d1f.css      1.65 KiB         0.42 KiB
  dist/css/chunk-0720b856.28c7c1dc.css      1.64 KiB         0.52 KiB
  dist/css/chunk-670b2b86.b73f2acc.css      1.59 KiB         0.48 KiB
  dist/css/chunk-1891248e.950bd772.css      1.57 KiB         0.50 KiB
  dist/css/chunk-1421ee6e.9d4a54da.css      1.57 KiB         0.48 KiB
  dist/css/chunk-2ee06ca8.0a2cd431.css      1.49 KiB         0.47 KiB
  dist/css/chunk-0ecb0016.e91567b0.css      1.38 KiB         0.43 KiB
  dist/css/chunk-665346fe.b5b0de24.css      1.36 KiB         0.42 KiB
  dist/css/chunk-3df90975.0ad2f1c3.css      1.16 KiB         0.37 KiB
  dist/css/chunk-20617cc5.ebae7724.css      1.15 KiB         0.36 KiB
  dist/css/chunk-36fb5c32.a64c098d.css      1.04 KiB         0.34 KiB
  dist/css/chunk-93e7ea42.fbd3c02c.css      1.04 KiB         0.35 KiB
  dist/css/chunk-3529e93a.5384b344.css      0.93 KiB         0.37 KiB
  dist/css/chunk-61d4bc1a.7134c902.css      0.90 KiB         0.31 KiB
  dist/css/chunk-836a18b0.09a47e10.css      0.88 KiB         0.34 KiB
  dist/css/chunk-20fd6e9e.5aaf7cba.css      0.88 KiB         0.33 KiB
  dist/css/chunk-0b83a9c0.df4ad987.css      0.86 KiB         0.33 KiB
  dist/css/chunk-ee1427b4.e1ddbf69.css      0.79 KiB         0.32 KiB
  dist/css/chunk-4b6e01c6.7aa83618.css      0.75 KiB         0.28 KiB
  dist/css/chunk-b9c87810.9eb66c9f.css      0.71 KiB         0.31 KiB
  dist/css/chunk-7e53ad86.2d99f979.css      0.60 KiB         0.33 KiB
  dist/css/chunk-c7e481b2.61ed9d5d.css      0.46 KiB         0.22 KiB
  dist/css/chunk-1c683ba0.d6684378.css      0.38 KiB         0.17 KiB
  dist/css/chunk-1ec1b1aa.98a4aa99.css      0.36 KiB         0.16 KiB
  dist/css/chunk-48dc0af1.98a4aa99.css      0.36 KiB         0.16 KiB
  dist/css/chunk-a08d5c64.f1c873fc.css      0.36 KiB         0.16 KiB
  dist/css/chunk-71fd7141.2ca1d591.css      0.36 KiB         0.16 KiB
  dist/css/chunk-e93eb2f0.8d9c94f0.css      0.28 KiB         0.19 KiB
  dist/css/chunk-aeec6e38.b67ed63a.css      0.22 KiB         0.16 KiB
  dist/css/chunk-687a978c.c9ab3ab3.css      0.11 KiB         0.10 KiB
  dist/css/chunk-897867a6.ac41b81a.css      0.08 KiB         0.10 KiB
  dist/css/chunk-715d1128.630c1054.css      0.08 KiB         0.10 KiB
  dist/css/chunk-82ef841e.68a4a897.css      0.07 KiB         0.09 KiB
  dist/css/chunk-e80d132e.ccf83212.css      0.06 KiB         0.08 KiB
  dist/css/chunk-0eec46d7.90cf07cd.css      0.06 KiB         0.07 KiB
  dist/css/chunk-29a55678.0e433876.css      0.00 KiB         0.02 KiB
  dist/css/chunk-3190e50d.0e433876.css      0.00 KiB         0.02 KiB
  dist/css/chunk-4469b1ce.0e433876.css      0.00 KiB         0.02 KiB
  dist/css/chunk-b8d94e6a.0e433876.css      0.00 KiB         0.02 KiB
  Images and other types of assets omitted.
 DONE  Build complete. Watching for changes...

Please tick the boxes

• You are using a supported version of Dashy (check the first two digits of the version number)
• You've checked that this issue hasn't already been raised
• You've checked the docs and troubleshooting guide
• You agree to the code of conduct

Dashy

[liss-bot]

Welcome to Dashy 👋
It's great to have you here, but unfortunately your ticket has been closed to prevent spam. Before reopening this issue, please ensure the following criteria are met.

Issues are sometimes closed when users:

• Have only recently joined GitHub
• Have not yet stared this repository
• Have not previously interacted with the repo

Before you reopen this issue, please also ensure that:

• You have checked that a similar issue does not already exist
• You have checked the documentation for an existing solution
• You have completed the relevant sections in the Issue template

Once you have verified the above standards are met, you may reopen this issue. Sorry for any inconvenience caused, I'm just a bot, and sometimes make mistakes 🤖

[Lissy93]

I guess it's being overridden by something in your config file.

You can instead updated this under appConfig, with:

• layout can be either horizontal, vertical or auto
• iconSize can be either small, medium or large

[Lissy93]

But this does look like a bug, probably introduced in the latest version, as the issue is present in the dev environment
(the demo site is super out of date)

[Antiz96]

I confirm the bug and the workaround (interactive editor and then "cancel edit").
I'm also using the latest Docker Image and those buttons used to worked correctly a few weeks ago so, indeed, probably a bug introduced in the latest version. Hope it helps in any way...

BTW, thank you for your awesome work :)

[liss-bot]

The fix for this issue has now been released in 2.0.9 ✨

If you haven't done so already, please update your instance to 2.0.9 or later. See 2.0.9 for full info.

Feel free to reach out if you need any more support. If you are enjoying Dashy, consider supporting the project.

[codebude]

Seems to be still/again broken. I use version 2.1.1 via Docker. Item size and layout buttons don't work. They start working after opening the UI editor and clicking the cancel button. While looking at the local storage in Chrome, I can see that the localstorage values (e.g. layoutOrientation) aren't set when clicking the layout buttons. After entering the edit mode and leaving it, the localstorage properties are written properly.

[codebude]

I was able to further isolate the problem. As soon as you set values for iconSize and layout in the appConfig (no matter which), it works as desired.
If you don't set the two settings, the above described misbehavior appears. I suspect that the default values (according to the documentation you don't have to set the values in the config) are somehow broken.