misc code cleanup and style changes

CHANGELOG.md

@@ -1,7 +1,5 @@
 # Changelog
 
-All notable changes to this project will be documented in this file. This project attempts to loosely adhere to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
-
 ## [Unreleased]
 
 ## [1.1.0] - 2019-02-15
@@ -9,7 +7,7 @@ All notable changes to this project will be documented in this file. This projec
 ### Added {added marginTop}
 
 - Danish translation from [@frederikspang](https://github.com/frederikspang).
-- Georgian translation from [@tatocaster ](https://github.com/tatocaster).
+- Georgian translation from [@tatocaster](https://github.com/tatocaster).
 - Changelog inconsistency section in Bad Practices
 
 ### Changed {fixed}
@@ -71,4 +69,4 @@ All notable changes to this project will be documented in this file. This projec
 
 [unreleased]: https://github.com/olivierlacan/keep-a-changelog/compare/v1.1.0...HEAD
 [1.1.0]: https://github.com/olivierlacan/keep-a-changelog/compare/v1.0.0...v1.1.0
-[1.0.0]: https://github.com/olivierlacan/keep-a-changelog/compare/v0.3.0...v1.0.0
+[1.0.0]: https://github.com/olivierlacan/keep-a-changelog/compare/v0.3.0...v1.0.0

src/core/api/Notifications.js

@@ -54,7 +54,7 @@
  * @typedef ToastButton
  * @property {string} [size='small'] Button size
  * @property {string} [look='filled'] Button appearance
- * @property {string} [color='brand'] Button color
+ * @property {string} [color='white'] Button color
  * @property {Function} [onClick=()=> vizality.api.notifications.closeToast(toastId)] Button click executor. Closes the toast by default.
  * @property {string} text Button text
  */
@@ -248,9 +248,24 @@ export default class Notifications extends API {
           if (!button.text || !isString(button.text)) {
             throw new TypeError('Toast button "text" property value must be a string!');
           }
-          if (button.size) assertString(button.size);
-          if (button.look) assertString(button.look);
-          if (button.color) assertString(button.color);
+          /**
+           * Checks types and set defaults for button properties.
+           */
+          if (button.size) {
+            assertString(button.size);
+          } else {
+            button.size = 'small';
+          }
+          if (button.look) {
+            assertString(button.look);
+          } else {
+            button.look = 'filled';
+          }
+          if (button.color) {
+            assertString(button.color);
+          } else {
+            button.color = 'white';
+          };
         });
       }
       if (toast.hasOwnProperty('timeout') && (!isNumber(toast.timeout) && typeof toast.timeout !== 'boolean')) {

src/core/api/settings/store/Store.js

@@ -19,7 +19,9 @@ function loadSettings (file) {
       )
     ];
   } catch (err) {
-    // Possibly corrupted settings; let's consider them empty
+    /**
+     * Possibly corrupted settings; let's consider them empty.
+     */
     return [ categoryId, {} ];
   }
 }

src/core/builtins/addon-manager/styles/addons/_list.scss

@@ -13,7 +13,6 @@
     animation: fadeShortSlideInFromBottom 0.15s forwards;
   }
   &-inner {
-    @include vz.size(100%);
     display: flex;
     justify-content: flex-start;
     flex-flow: column;

src/core/builtins/dashboard/styles/main.scss

@@ -14,7 +14,8 @@
   margin: 0 auto;
   display: flex;
   box-sizing: border-box;
-  padding: 40px;
+  padding: 20px 40px;
+  height: 100%;
   > div {
     display: flex;
     flex-flow: column;

src/core/builtins/dashboard/styles/parts/_content.scss

@@ -10,7 +10,9 @@
     flex: 0 0 auto;
     &-subtext {
       margin-top: 15px;
-      font-weight: 400;
+      font-weight: 300;
+      line-height: 1.4;
+      font-size: 18px;
     }
     &-background {
       position: absolute;

src/core/builtins/dashboard/styles/parts/_section.scss

@@ -1,4 +1,13 @@
 .vz-dashboard-section {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  &-contents {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex: 1;
+  }
   & + & {
     margin-top: 40px;
   }

src/core/builtins/dashboard/styles/parts/_sidebar.scss

@@ -6,6 +6,16 @@
 
 .vz-dashboard-sidebar {
   width: var(--vz-dashboard-sidebar-width);
+  .vz-error-boundary {
+    height: 100%;
+    padding: 20px;
+    &-block {
+      background: var(--background-secondary-alt);
+    }
+  }
+  .vz-dashboard-sidebar-item-icon-wrapper {
+    @include vz.size(32px);
+  }
   .vz-dashboard-sidebar-item {
     &.disabled {
       .vz-dashboard-sidebar-item-icon-wrapper,
@@ -70,6 +80,16 @@
     .content-3QAtGj {
       display: none;
     }
+    /**
+     * Game activity panel.
+     */
+     .body-GmmuPm {
+       justify-content: center;
+     }
+     .actions-aUdUfC,
+     .info-WdNIDE {
+       display: none;
+     }
     /**
      * Voice connected panel.
      */

src/core/builtins/notifications/components/Toast.jsx

@@ -162,7 +162,7 @@ export default memo(({ toast }) => {
       toast.buttons.unshift(CloseButton);
     } else {
       CloseButton.text = 'Okay';
-      CloseButton.color = 'brand';
+      CloseButton.color = 'white';
       CloseButton.look = 'filled';
       toast.buttons = [ CloseButton ];
     }
@@ -199,6 +199,7 @@ export default memo(({ toast }) => {
             markdown={toast.markdown}
             image={toast.image}
             icon={toast.icon}
+            buttons={toast.buttons}
             header={toast.header}
             toastId={toast.id}
             content={toast.content}

src/core/builtins/notifications/styles/_toasts.scss

@@ -55,6 +55,9 @@
     }
     &--no-content {
       &#{$base}--no-footer {
+        .vz-toast-header {
+          font-weight: 400;
+        }
         .vz-toast-meta {
           display: flex;
           width: 100%;

src/core/builtins/quick-code/index.js

@@ -10,10 +10,7 @@ const { writeFile, readFile } = promises;
 
 export default class QuickCode extends Builtin {
   async start () {
-    vizality.api.settings._registerBuiltinPage({
-      addonId: this.addonId,
-      id: 'quick-code',
-      path: '/quick-code',
+    vizality.api.settings._registerBuiltinSection({
       heading: 'Quick Code',
       subheading: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin ornare tellus nec dapibus finibus. Nulla massa velit, mattis non eros a, interdum tristique massa. Curabitur mauris sem, porttitor quis ligula vitae, suscipit hendrerit quam. Nunc sit amet enim id elit vehicula tempus sed sed tellus. Aliquam felis turpis, malesuada ut tortor id, iaculis facilisis felis.',
       icon: 'Compose',
@@ -21,10 +18,11 @@ export default class QuickCode extends Builtin {
     });
 
     this.watcher = false;
-
     this._customCSS = this.settings.get('customCSS');
 
-    closeSync(openSync(join(__dirname, 'stores', 'css', 'custom.scss'), 'a'));
+    closeSync(
+      openSync(join(__dirname, 'stores', 'css', 'custom.scss'), 'a')
+    );
 
     this._customCSSFilePath = join(__dirname, 'stores', 'css', 'custom.scss');
     await this._loadCustomCSS();

src/core/builtins/quick-code/styles/main.css

@@ -1,5 +1,4 @@
 [vz-route='quick-code'] .vz-dashboard-layout {
-  height: 100%;
   overflow: hidden;
 }
 

src/core/modules/components/Markdown.jsx

@@ -12,7 +12,7 @@ import { CodeBlock, Icon, DeferredRender, Spinner, LazyImageZoomable, ImageModal
 
 const { readFile } = promises;
 
-export default memo(({ source, className }) => {
+export default memo(({ source }) => {
   const [ markdown, setMarkdown ] = useState();
   const { base } = getModule('base');
   const { size32, size24, size20, size16, size14, size12 } = getModule('size32');
@@ -26,10 +26,12 @@ export default memo(({ source, className }) => {
       setMarkdown(md.replace(/{(fixed|added|improved|progress)( marginTop)?}/g, '').replace(/(# Changelog)/, '').trim());
     };
 
-    if (existsSync(source)) {
-      getSource();
-    } else {
-      setMarkdown(source.trim());
+    if (source) {
+      if (existsSync(source)) {
+        getSource();
+      } else {
+        setMarkdown(source.trim());
+      }
     }
   }, [ markdown ]);
 
@@ -215,13 +217,15 @@ export default memo(({ source, className }) => {
   return (
     <>
       {existsSync(source)
-        ? <DeferredRender idleTimeout={2500} fallback={
-          <div className='vz-markdown-content-loading'>
-            <Spinner />
-          </div>
-        }>
-          <Markdown source={markdown} renderers={renderers} />
-        </DeferredRender>
+        ? (
+          <DeferredRender idleTimeout={2500} fallback={
+            <div className='vz-markdown-content-loading'>
+              <Spinner />
+            </div>
+          }>
+            <Markdown source={markdown} renderers={renderers} />
+          </DeferredRender>
+        )
         : <Markdown source={markdown} renderers={renderers} />
       }
     </>

src/core/modules/constants/index.js

@@ -80,45 +80,46 @@ export const Regexes = Object.freeze({
 });
 
 export const Events = Object.freeze({
-  // --- Vizality Settings
+  /**
+   * Vizality Settings
+   */
   VIZALITY_READY: 'VIZALITY_READY',
   VIZALITY_SETTINGS_READY: 'VIZALITY_SETTINGS_READY',
   VIZALITY_SETTING_UPDATE: 'VIZALITY_SETTING_UPDATE',
   VIZALITY_SETTING_TOGGLE: 'VIZALITY_SETTING_TOGGLE',
 
-  // --- Vizality Addons
+  /**
+   * Addons
+   */
   VIZALITY_ADDON_SETTINGS_REGISTER: 'VIZALITY_ADDON_SETTINGS_REGISTER',
   VIZALITY_ADDON_SETTINGS_UNREGISTER: 'VIZALITY_ADDON_SETTINGS_UNREGISTER',
   VIZALITY_ADDON_SETTING_UPDATE: 'VIZALITY_ADDON_SETTING_UPDATE',
   VIZALITY_ADDON_SETTING_TOGGLE: 'VIZALITY_ADDON_SETTING_TOGGLE',
-
-  // --- Vizality Plugins
-  VIZALITY_PLUGINS_READY: 'VIZALITY_PLUGINS_READY',
-
-  // --- Vizality Themes
-  VIZALITY_THEMES_READY: 'VIZALITY_THEMES_READY',
-
-  // --- Vizality APIs
+  VIZALITY_ADDON_UNINSTALL_CONFIRM: 'VIZALITY_ADDON_UNINSTALL_CONFIRM',
+  VIZALITY_ADDON_UNINSTALL: 'VIZALITY_ADDON_UNINSTALL',
+  VIZALITY_ADDON_INSTALL_CONFIRM: 'VIZALITY_ADDON_INSTALL_CONFIRM',
+  VIZALITY_ADDON_INSTALL: 'VIZALITY_ADDON_INSTALL',
+  VIZALITY_ADDONS_READY: 'VIZALITY_ADDONS_READY',
+
+  /**
+   * Vizality APIs
+   */
   VIZALITY_ACTION_ADD: 'VIZALITY_ACTION_ADD',
   VIZALITY_ACTION_REMOVE: 'VIZALITY_ACTION_REMOVE',
   VIZALITY_ACTION_REMOVE_ALL: 'VIZALITY_ACTION_REMOVE_ALL',
   VIZALITY_ACTION_REMOVE_ALL_BY_CALLER: 'VIZALITY_ACTION_REMOVE_ALL_BY_CALLER',
-  // -
   VIZALITY_COMMAND_ADD: 'VIZALITY_COMMAND_ADD',
   VIZALITY_COMMAND_REMOVE: 'VIZALITY_COMMAND_REMOVE',
   VIZALITY_COMMAND_REMOVE_ALL: 'VIZALITY_COMMAND_REMOVE_ALL',
   VIZALITY_COMMAND_REMOVE_ALL_BY_CALLER: 'VIZALITY_COMMAND_REMOVE_ALL_BY_CALLER',
-  // -
   VIZALITY_ROUTE_ADD: 'VIZALITY_ROUTE_ADD',
   VIZALITY_ROUTE_REMOVE: 'VIZALITY_ROUTE_REMOVE',
   VIZALITY_ROUTE_REMOVE_ALL: 'VIZALITY_ROUTE_REMOVE_ALL',
   VIZALITY_ROUTE_REMOVE_ALL_BY_CALLER: 'VIZALITY_ROUTE_REMOVE_ALL_BY_CALLER',
-  // -
   VIZALITY_KEYBIND_ADD: 'VIZALITY_KEYBIND_ADD',
   VIZALITY_KEYBIND_REMOVE: 'VIZALITY_KEYBIND_REMOVE',
   VIZALITY_KEYBIND_REMOVE_ALL: 'VIZALITY_KEYBIND_REMOVE_ALL',
   VIZALITY_KEYBIND_REMOVE_ALL_BY_CALLER: 'VIZALITY_KEYBIND_REMOVE_ALL_BY_CALLER',
-  // -
   VIZALITY_NOTICE_SEND: 'VIZALITY_NOTICE_SEND',
   VIZALITY_NOTICE_CLOSE: 'VIZALITY_NOTICE_CLOSE',
   VIZALITY_NOTICE_CLOSE_ALL: 'VIZALITY_NOTICE_CLOSE_ALL',
@@ -129,7 +130,6 @@ export const Events = Object.freeze({
   VIZALITY_TOAST_CLOSE_ALL_QUEUED: 'VIZALITY_TOAST_CLOSE_ALL_QUEUED',
   VIZALITY_TOAST_CLOSE_ALL_ACTIVE: 'VIZALITY_TOAST_CLOSE_ALL_ACTIVE',
   VIZALITY_TOAST_CLOSE_ALL_BY_CALLER: 'VIZALITY_TOAST_CLOSE_ALL_BY_CALLER',
-  // -
   VIZALITY_POPUP_WINDOW_OPEN: 'VIZALITY_POPUP_WINDOW_OPEN',
   VIZALITY_POPUP_WINDOW_CLOSE: 'VIZALITY_POPUP_WINDOW_CLOSE'
 });