Separate Custom Javascript and CSS from `.settings.json`

[Alexhuszagh]

Feature description

In Insider builds, which has persistent custom Javascript and CSS, the data is stored in .settings.json, which also contains some user-specific data. For example,

{
  "cwd": {
    "current": "~/.notable",
    "recents": "[\"~/.notable\"]"
  },
  "fileSystem": {
    "latestPaths": "[[...]]"
  },
  "customCode": {
    "css": "...",
    "javascript": "...",
  },
  ...
}

Feature motivation

If I cloud-sync between two devices my notes and settings, this means that I will overwrite my cwd and latestPaths on each sync between devices (I'm currently using syncthing, but the same would be true with Dropbox). This means I cannot sync my settings file, containing my custom code, or need to reset the data directory every time I open Notable.

This could be solved by having .settings.css and .settings.js files, which are read on startup, containing the custom code, and then users could sync these files while ignoring .settings.json. This would also allow users to edit the CSS and Javascript in third-party editors with ease, since it would be stored in file, rather than a single-line string with escaped newlines, etc.

[hasnolen]

Mostly unrelated -- how did you even realize it realize it was possible to use that customCode key there and inject your own CSS? The only place I can find any documentation of it on the repo is in this issue itself.

[MMK21Hub]

Documentation for the feature is available on the Custom Code help page, and it can be edited from within the app using the Custom CSS/JS Editor preferences tab.

Note that this functionality is only available in the v1.9 betas.