Auto Publish new pages

2024-12-23 00:41:37 +03:00 · 2022-05-08 01:33:04 +00:00 · 2022-05-08 01:33:04 +00:00 · 483f0f9a2f
commit 483f0f9a2f
parent 40b7732bda
6 changed files with 145 additions and 8 deletions
--- a/configuring.md
+++ b/configuring.md
@ -27,6 +27,7 @@ The following file provides a reference of all supported configuration options.

 - [**`pageInfo`**](#pageinfo) - Header text, footer, title, navigation, etc
  - [`navLinks`](#pageinfonavlinks-optional) - Links to display in the navigation bar
+- [**`pages`**](#pages-optional) - List of additional config files, for multi-page dashboards
 - [**`appConfig`**](#appconfig-optional) - Main application settings
  - [`webSearch`](#appconfigwebsearch-optional) - Configure web search engine options
  - [`hideComponents`](#appconfighidecomponents-optional) - Show/ hide page components
@ -56,6 +57,7 @@ The following file provides a reference of all supported configuration options.
 **`pageInfo`** | `object` | Required | Basic meta data like title, description, nav bar links, footer text. See [`pageInfo`](#pageinfo)
 **`appConfig`** | `object` | _Optional_ | Settings related to how the app functions, including API keys and global styles. See [`appConfig`](#appconfig-optional)
 **`sections`** | `array` | Required | An array of sections, each containing an array of items, which will be displayed as links. See [`section`](#section)
+**`pages`** | `array` | _Optional_ | An array additional config files, used for multi-page dashboards. See [`pages`](#pages-optional)

 **[⬆️ Back to Top](#configuring)**

@ -81,6 +83,15 @@ The following file provides a reference of all supported configuration options.

 **[⬆️ Back to Top](#configuring)**

+### `pages[]` _(optional)_
+
+**Field** | **Type** | **Required**| **Description**
+--- | --- | --- | ---
+**`name`** | `string` |  Required | A unique name for that page
+**`path`** | `string` |  Required | The path (local or remote) to the config file to use.<br>For files located within `/public`, you only need to specify filename, for externally hosted files you must include the full URL
+
+**[⬆️ Back to Top](#configuring)**
+
 ### `appConfig` _(optional)_

 **Field** | **Type** | **Required**| **Description**
--- a/credits.md
+++ b/credits.md
@ -243,7 +243,7 @@
        <a href="https://github.com/emiran-orange">
            <img src="https://avatars.githubusercontent.com/u/71817149?v=4" width="80;" alt="emiran-orange"/>
            <br />
-            <sub><b>emiran-orange</b></sub>
+            <sub><b>Emiran-orange</b></sub>
        </a>
    </td>
    <td align="center">
@ -275,6 +275,13 @@
            <sub><b>Kieren Connell</b></sub>
        </a>
    </td>
+    <td align="center">
+        <a href="https://github.com/LeoColman">
+            <img src="https://avatars.githubusercontent.com/u/1577251?v=4" width="80;" alt="LeoColman"/>
+            <br />
+            <sub><b>Leonardo Colman</b></sub>
+        </a>
+    </td>
    <td align="center">
        <a href="https://github.com/rubjo">
            <img src="https://avatars.githubusercontent.com/u/42270947?v=4" width="80;" alt="rubjo"/>
@ -288,13 +295,6 @@
            <br />
            <sub><b>Ryan Turner</b></sub>
        </a>
-    </td>
-    <td align="center">
-        <a href="https://github.com/royshreyaaa">
-            <img src="https://avatars.githubusercontent.com/u/88572557?v=4" width="80;" alt="royshreyaaa"/>
-            <br />
-            <sub><b>Shreya Roy</b></sub>
-        </a>
    </td></tr>
 </table>
 <!-- readme: contributors -end -->
--- a/pages-and-sections.md
+++ b/pages-and-sections.md
@ -0,0 +1,58 @@
+# Pages and Sections
+
+## Multi-Page Support
+
+You can have additional pages within your dashboard, with each having it's own config file. The config files for sub-pages can either be stored locally, or hosted separately. A link to each additional page will be displayed in the navigation bar.
+
+You can edit additional pages using the interactive editor, exactly the same was as your primary page (so long as it's local). But please save changes to one page, before you start editing the next. 
+
+### Using Local Sub-Pages
+
+To get started, create a new `.yml` config file for your sub-page, placing it within `/app/public`. Then within your primary `conf.yml`, choose a name, and specify the path to the new file.
+
+For example:
+
+```yaml
+pages:
+- name: Networking Services
+  path: 'networking.yml'
+- name: Work Stuff
+  path: 'work.yml'
+```
+
+If you're sub-page is located within `/app/public`, then you only need to specify the filename, but if it's anywhere else, then the full path is required.
+
+### Using Remote Sub-Pages
+
+Config files don't need to be local, you can store them anywhere, and data will be imported as sub-pages on page load.
+
+For example:
+
+```yaml
+pages:
+- name: Getting Started
+  path: 'https://snippet.host/tvcw/raw'
+- name: Homelab
+  path: 'https://snippet.host/tetp/raw'
+- name: Browser Startpage
+  path: 'https://snippet.host/zcom/raw'
+```
+
+There are many options of how this can be used. You could store your config within a Git repository, in order to easily track and rollback changes. Or host your config on your NAS, to have it backed up with the rest of your files. Or use a hosted paste service, for example [snippet.host](https://snippet.host/), which supports never-expiring CORS-enabled pastes, which can also be edited later.
+
+You will obviously not be able to write updates to remote configs directly through the UI editor, but you can still make and preview changes, then use the export menu to get a copy of the new config, which can then be pasted to the remote source manually.
+The config file must, of course be accessible from within Dashy. If your config contains sensitive info (like API keys, credentials, secret URLs, etc), take care not to expose it to the internet.
+
+The following example shows creating a config, publishing it as a [Gist](https://gist.github.com/), copying the URL to the raw file, and using it within your dashboard.
+
+<p align="center">
+  <img width="700" alt="Public config in a gist demo"
+    src="https://i.ibb.co/55jm3LG/how-to-use-remote-config-sub-page.gif"
+  />
+</p>
+
+### Restrictions
+
+Only top-level fields supported by sub-pages are `pageInfo` and `sections`. The `appConfig` and `pages` will always be inherited from your main `conf.yml` file. Other than that, sub-pages behave exactly the same as your default view, and can contain sections, items, widgets and page info like nav links, title and logo.
+
+Note that since page paths are required by the router, they are set at build-time, not run-time, and so a rebuild (happens automatically) is required for changes to page paths to take effect (this only applies to changes to the `pages` array, rebuild isn't required for editing page content).
--- a/readme.md
+++ b/readme.md
@ -21,6 +21,7 @@
 - [Backup & Restore](/docs/backup-restore.md) - Guide to backing up config with Dashy's cloud sync feature
 - [Icons](/docs/icons.md) - Outline of all available icon types for sections and items, with examples
 - [Language Switching](/docs/multi-language-support.md) - Details on how to switch language, or add a new locale
+- [Pages and Sections](/docs/pages-and-sections.md) - Multi-page support, sections, items and sub-items
 - [Status Indicators](/docs/status-indicators.md) - Using Dashy to monitor uptime and status of your apps
 - [Searching  & Shortcuts](/docs/searching.md) - Searching, launching methods + keyboard shortcuts
 - [Theming](/docs/theming.md) - Complete guide to applying, writing and modifying themes + styles
--- a/theming.md
+++ b/theming.md
@ -69,6 +69,16 @@ Custom CSS can be developed, tested and applied directly through the UI. Althoug

 This can be done from the Config menu (spanner icon in the top-right), under the Custom Styles tab. This is then associated with `appConfig.customCss` in local storage. Styles can also be directly applied to this attribute in the config file, but this may get messy very quickly if you have a lot of CSS.

+### Page-Specific Styles
+
+If you've got multiple pages within your dashboard, you can choose to target certain styles to specific pages. The top-most element within `<body>` will have a class name specific to the current sub-page. This is usually the page's name, all lowercase, with dashes instead of spaces, but you can easily check this yourself within the dev tools.
+
+For example, if the pages name was "CFT Toolbox", and you wanted to target `.item`s, you would do:
+
+```css
+.cft-toolbox .item { border: 4px solid yellow; }
+```
+
 ### Loading External Stylesheets

 The URI of a stylesheet, either local or hosted on a remote CDN can be passed into the config file. The attribute `appConfig.externalStyleSheet` accepts either a string, or an array of strings. You can also pass custom font stylesheets here, they must be in a CSS format (for example, `https://fonts.googleapis.com/css2?family=Cutive+Mono`).
--- a/troubleshooting.md
+++ b/troubleshooting.md
@ -7,7 +7,11 @@
 ### Contents
 - [Refused to Connect in Web Content View](#refused-to-connect-in-modal-or-workspace-view)
 - [404 On Static Hosting](#404-on-static-hosting)
+- [404 from Mobile Home Screen](#404-after-launch-from-mobile-home-screen)
 - [Yarn Build or Run Error](#yarn-error)
+- [Remote Config Not Loading](#remote-config-not-loading)
+- [Heap limit Allocation failed](ineffective-mark-compacts-near-heap-limit-allocation-failed)
+- [Command failed with signal "SIGKILL"](#command-failed-with-signal-sigkill)
 - [Auth Validation Error: "should be object"](#auth-validation-error-should-be-object)
 - [App Not Starting After Update to 2.0.4](#app-not-starting-after-update-to-204)
 - [Keycloak Redirect Error](#keycloak-redirect-error)
@ -86,6 +90,15 @@ If this works, but you wish to continue using HTML5 history mode, then a bit of

 ---

+## 404 after Launch from Mobile Home Screen
+
+Similar to the above issue, if you get a 404 after using iOS's “add to Home Screen” feature, then this is caused by Vue router.
+It can be fixed by setting `appConfig.routingMode` to `hash`
+
+See also: [#628](https://github.com/Lissy93/dashy/issues/628)
+
+---
+
 ## Yarn Error

 For more info, see [Issue #1](https://github.com/Lissy93/dashy/issues/1)
@ -104,6 +117,50 @@ Alternatively, as a workaround, you have several options:

 ---

+## Remote Config Not Loading
+
+If you've got a multi-page dashboard, and are hosting the additional config files yourself, then CORS rules will apply. A CORS error will look something like:
+
+```
+Access to XMLHttpRequest at 'https://example.com/raw/my-config.yml' from origin 'http://dashy.local' has been blocked by CORS policy:
+No 'Access-Control-Allow-Origin' header is present on the requested resource.
+```
+
+The solution is to add the appropriate headers onto the target server, to allow it to accept requests from the origin where you're running Dashy.
+
+If it is a remote service, that you do not have admin access to, then another option is to proxy the request. Either host your own, or use a publicly accessible service, like [allorigins.win](https://allorigins.win), e.g: `https://api.allorigins.win/raw?url=https://pastebin.com/raw/4tZpaJV5`. For git-based services specifically, there's [raw.githack.com](https://raw.githack.com/)
+
+---
+
+##  Ineffective mark-compacts near heap limit Allocation failed
+
+If you see an error message, similar to:
+
+```
+<--- Last few GCs --->
+
+[61:0x74533040] 229060 ms: Mark-sweep (reduce) 127.1 (236.9) -> 127.1 (137.4) MB, 5560.7 / 0.3 ms (average mu = 0.286, current mu = 0.011) allocation failure scavenge might not succeed
+
+<--- JS stacktrace --->
+
+FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
+```
+
+
+This is likely caused by insufficient memory allocation to the container. When the container first starts up, or has to rebuild, the memory usage spikes, and if there isn't enough memory, it may terminate. This can be specified with, for example: `--memory=1024m`. For more info, see [Docker: Runtime options with Memory, CPUs, and GPUs](https://docs.docker.com/config/containers/resource_constraints/).
+
+See also: [#380](https://github.com/Lissy93/dashy/issues/380), [#350](https://github.com/Lissy93/dashy/issues/350), [#297](https://github.com/Lissy93/dashy/issues/297), [#349](https://github.com/Lissy93/dashy/issues/349), [#510](https://github.com/Lissy93/dashy/issues/510) and [#511](https://github.com/Lissy93/dashy/issues/511)
+
+---
+
+## Command failed with signal "SIGKILL"
+
+In Docker, this can be caused by not enough memory. When the container first starts up, or has to rebuild, the memory usage spikes, and so a larger allocation may be required. This can be specified with, for example: `--memory=1024m`. For more info, see [Docker: Runtime options with Memory, CPUs, and GPUs](https://docs.docker.com/config/containers/resource_constraints/)
+
+See also [#624](https://github.com/Lissy93/dashy/issues/624)
+
+---
+
 ## Auth Validation Error: "should be object"

 In V 1.6.5 an update was made that in the future will become a breaking change. You will need to update you config to reflect this before V 2.0.0 is released. In the meantime, your previous config will continue to function normally, but you will see a validation warning. The change means that the structure of the `appConfig.auth` object is now an object, which has a `users` property.