fix: use settings store to retrieve useColorFallback setting (#533)

* fix: respect landingpage settings (use settings/server store, not localStore)

* fix: use settings store to retrieve useColorFallback setting

* fix: fixed imports

src/route.js

@@ -1,6 +1,8 @@
 import Vue from 'vue';
 import VueRouter from 'vue-router';
 
+import { useSettingsStore } from '~/stores/settings';
+
 const Home = () => import('./views/Home.vue');
 
 // Activity views for desktop
@@ -30,7 +32,8 @@ const router = new VueRouter({
     {
       path: '/',
       redirect: _to => {
-        return localStorage.landingpage || '/home';
+        const settings = useSettingsStore();
+        return settings.landingpage || '/home';
       },
     },
     { path: '/home', component: Home },

src/util/color.ts

@@ -3,6 +3,7 @@ import { Category, matchString, loadClasses } from './classes';
 import Color from 'color';
 import * as d3 from 'd3';
 import { IEvent, IBucket } from './interfaces';
+import { useSettingsStore } from '~/stores/settings';
 
 // See here for examples:
 //   https://bl.ocks.org/pstuffa/3393ff2711a53975040077b7453781a9
@@ -99,10 +100,8 @@ export function getCategoryColorFromString(str: string): string {
 
 function fallbackColor(str: string): string {
   // Get fallback color
-  // TODO: Fetch setting from somewhere better, where defaults are respected
-  const useColorFallback =
-    localStorage !== undefined ? localStorage.useColorFallback === 'true' : true;
-  if (useColorFallback) {
+  const settings = useSettingsStore();
+  if (settings.useColorFallback) {
     return getColorFromString(str);
   } else {
     return COLOR_UNCAT;