Release 1.0.3 (#157)

* enhancement(app): updated packages

* enhancement(components): minor updates to map and box resize

* refactor(repo): renamed interfaces to types

* fix(build): fixed vue build flags

* enhancement(maps): sped up framerate for radar layers

* enhancement(settings): added framerate setting for maps

* fix(vue): updated vue to fix box resize issues

* fix(settings): added step value to map pitch

* enhancement(app): bump version

api/package.json

@@ -5,7 +5,7 @@
     "author": "Andrew Courtice",
     "license": "MIT",
     "dependencies": {
-        "@vercel/node": "^1.8.4",
+        "@vercel/node": "^1.8.5",
         "lodash": "^4.17.20",
         "node-fetch": "^2.6.1"
     }

client/build/_base/config.js

@@ -33,7 +33,7 @@ export default {
     },
 
     resolve: {
-        extensions: ['.ts', '.tsx', '.js', '.jsx', '.vue'],
+        extensions: ['.ts', '.js'],
 
         alias: {           
             'components': path.resolve(__dirname, '../src/components'),
@@ -77,12 +77,16 @@ export default {
     },
 
     plugins: [
+
         new webpack.EnvironmentPlugin({
             'MAPBOX_API_KEY': '',
             'WORLDTIDES_API_KEY': '',
             'OWM_API_KEY': '',
             'GA_TRACKING_ID': '',
             'SENTRY_DSN': '',
+        }),
+
+        new webpack.DefinePlugin({
             '__VUE_OPTIONS_API__': false, 
             '__VUE_PROD_DEVTOOLS__': false 
         }),

client/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@ocula/client",
     "title": "Ocula",
-    "version": "1.0.2",
+    "version": "1.0.3",
     "main": "./src/index.ts",
     "repository": "https://github.com/andrewcourtice/ocula.git",
     "author": "Andrew Courtice",
@@ -20,22 +20,22 @@
         "@ocula/router": "1.0.0",
         "@ocula/state": "1.0.0",
         "@ocula/utilities": "1.0.0",
-        "@sentry/browser": "^5.27.2",
-        "@sentry/integrations": "^5.27.2",
-        "core-js": "3.6.5",
+        "@sentry/browser": "^5.29.0",
+        "@sentry/integrations": "^5.29.0",
+        "core-js": "3.8.1",
         "regenerator-runtime": "^0.13.7",
-        "vue": "3.0.2",
-        "workbox-window": "^5.1.4"
+        "vue": "3.0.5",
+        "workbox-window": "^6.0.2"
     },
     "devDependencies": {
-        "@babel/core": "^7.12.3",
+        "@babel/core": "^7.12.9",
         "@babel/plugin-syntax-dynamic-import": "^7.8.3",
         "@babel/plugin-transform-typescript": "^7.12.1",
-        "@babel/preset-env": "^7.12.1",
-        "@babel/preset-typescript": "^7.12.1",
+        "@babel/preset-env": "^7.12.7",
+        "@babel/preset-typescript": "^7.12.7",
         "@babel/register": "^7.12.1",
-        "@types/d3": "^5.16.3",
-        "@vue/compiler-sfc": "3.0.2",
+        "@types/d3": "^6.2.0",
+        "@vue/compiler-sfc": "3.0.5",
         "autoprefixer": "^9.8.6",
         "babel-loader": "^8.1.0",
         "babel-plugin-const-enum": "^1.0.1",
@@ -54,7 +54,7 @@
         "style-loader": "^1.2.1",
         "terser-webpack-plugin": "^2.3.5",
         "url-loader": "^4.1.0",
-        "vue-loader": "16.0.0-beta.7",
+        "vue-loader": "16.1.1",
         "vue-style-loader": "^4.1.2",
         "webpack": "^4.44.1",
         "webpack-bundle-analyzer": "^3.8.0",

client/src/components/forecast/daily-forecast.vue

@@ -73,7 +73,7 @@ import {
 import type {
     Formatted,
     IMappedForecastDay
-} from '../../interfaces/state';
+} from '../../types/state';
 
 export default defineComponent({
 

client/src/components/forecast/hourly-forecast.vue

@@ -55,7 +55,7 @@ import {
 import type {
     Formatted,
     IMappedForecastHour
-} from '../../interfaces/state';
+} from '../../types/state';
 
 export default defineComponent({
     

client/src/components/modals/location.vue

@@ -49,7 +49,7 @@ import {
 
 import type {
     ILocation
-} from '../../interfaces/location';
+} from '../../types/location';
 
 export default defineComponent({
 

client/src/constants/core/migrations.ts

@@ -7,7 +7,7 @@ import {
 
 import type {
     ISettings
-} from '../../interfaces/storage';
+} from '../../types/storage';
 
 type Migration = (settings: ISettings) => ISettings;
 

client/src/constants/core/routes.ts

@@ -1,19 +1,26 @@
 export default {
     forecast: {
-        index: 'forecast-index',
+        index: 'forecast:index',
     },
     maps: {
-        index: 'maps-index'
+        index: 'maps:index'
     },
     settings: {
-        index: 'settings-index',
-        locations: 'settings-locations',
-        sections: 'settings-sections',
-        themes: 'settings-themes',
-        about: 'settings-about'
+        index: 'settings:index',
+        forecast: {
+            locations: 'settings:forecast:locations',
+            sections: 'settings:forecast:sections',
+        },
+        maps: {
+            display: 'settings:maps:display'
+        },
+        general: {
+            theme: 'settings:general:theme',
+            about: 'settings:general:about'
+        }
     },
     error: {
-        index: 'error-index',
-        notFound: 'error-not-found'
+        index: 'error:index',
+        notFound: 'error:not:found'
     }
 } as const;

client/src/constants/core/settings.ts

@@ -4,7 +4,7 @@ import FORECAST_SECTION from '../../enums/forecast/section';
 
 import type {
     ISettings
-} from '../../interfaces/storage';
+} from '../../types/storage';
 
 export default {
     version: 1.1,
@@ -38,5 +38,8 @@ export default {
     },
     maps: {
         default: MAP.radar,
+        zoom: 6,
+        pitch: 0,
+        framerate: 500
     }
 } as ISettings;

client/src/constants/forecast/figure.ts

@@ -1,4 +1,4 @@
-import figures from '../../assets/images/figures/index';
+import figures from '../../assets/images/figures';
 import PHASE from '../../enums/forecast/phase';
 
 interface IFigure extends Record<number, string> {};

client/src/constants/forecast/formats.ts

@@ -11,7 +11,7 @@ import {
 
 import type {
     IForecastWeather
-} from '../../interfaces/weather';
+} from '../../types/weather';
 
 const {
     general,

client/src/constants/forecast/sections.ts

@@ -9,7 +9,7 @@ import Tides from '../../components/forecast/tides.vue';
 import type {
     Formatted,
     IMappedForecast
-} from '../../interfaces/state';
+} from '../../types/state';
 
 interface IForecastSection {
     label: string;

client/src/constants/forecast/tides-chart-options.ts

@@ -10,11 +10,11 @@ import {
 
 import type {
     Formatted
-} from '../../interfaces/state';
+} from '../../types/state';
 
 import type {
     IForecastTideHeight
-} from '../../interfaces/weather';
+} from '../../types/weather';
 
 type ChartOptions = ILineOptions<Formatted<IForecastTideHeight>>;
 

client/src/constants/forecast/trends.ts

@@ -15,11 +15,11 @@ import {
 
 import type {
     IForecastHour
-} from '../../interfaces/weather';
+} from '../../types/weather';
 
 import {
     Formatted
-} from '../../interfaces/state';
+} from '../../types/state';
 
 type ChartOptions = ILineOptions<Formatted<IForecastHour>>;
 

client/src/constants/maps/maps.ts

@@ -4,7 +4,7 @@ import type {
     Formatted,
     IFormatter,
     IMappedForecast
-} from '../../interfaces/state';
+} from '../../types/state';
 
 interface IMapLegend {
     colour: string;

client/src/index.ts

@@ -1,3 +1,3 @@
-import start from './startup/index';
+import start from './startup';
 
 export default start();

client/src/routes/index.ts

@@ -3,10 +3,10 @@ import Maps from './maps.vue';
 import Settings from './settings.vue';
 import Error from './error.vue';
 
-import forecast from './forecast/index';
-import maps from './maps/index';
-import settings from './settings/index';
-import error from './error/index';
+import forecast from './forecast';
+import maps from './maps';
+import settings from './settings';
+import error from './error';
 
 import type {
     RouteRecordRaw

client/src/routes/maps/index.ts

@@ -15,4 +15,4 @@ export default [
         props: true,
         component: defineAsyncComponent(() => import(/* webpackChunkName: 'maps' */ './index.vue'))
     }
-];
+] as RouteRecordRaw[];

client/src/routes/maps/index.vue

@@ -25,6 +25,8 @@
                     :key="theme.core.mapStyle"
                     :latitude="forecast.lat.raw"
                     :longitude="forecast.lon.raw"
+                    :zoom="settings.maps.zoom"
+                    :pitch="settings.maps.pitch"
                     :style="theme.core.mapStyle"
                     @movestart="onMoveStart"
                     @moveend="onMoveEnd"
@@ -125,6 +127,8 @@ export default defineComponent({
 
         let layerIndex = ref(0);
 
+        const settings = computed(() => state.settings);
+
         const map = computed(() => {
             let {
                 layers,
@@ -196,7 +200,7 @@ export default defineComponent({
         function runLoop() {
             intervalHandle = window.setInterval(() => {
                 layerIndex.value = layerIndex.value === layers.value.length - 1 ? 0 : layerIndex.value + 1;
-            }, 1000);
+            }, state.settings.maps.framerate);
         }
 
         function startPlaying() {
@@ -248,6 +252,7 @@ export default defineComponent({
         return {
             theme,
             forecast,
+            settings,
             map,
             status,
             layers,

client/src/routes/settings/forecast/index.ts

@@ -0,0 +1,21 @@
+import ROUTES from '../../../constants/core/routes';
+
+import Locations from './locations.vue';
+import Sections from './sections.vue';
+
+import type {
+    RouteRecordRaw
+} from '@ocula/router';
+
+export default [
+    {
+        path: 'forecast/locations',
+        name: ROUTES.settings.forecast.locations,
+        component: Locations
+    },
+    {
+        path: 'forecast/sections',
+        name: ROUTES.settings.forecast.sections,
+        component: Sections
+    }
+] as RouteRecordRaw[];

client/src/routes/settings/locations.vue → client/src/routes/settings/forecast/locations.vue

@@ -12,9 +12,9 @@
 </template>
 
 <script lang="ts">
-import ROUTES from '../../constants/core/routes';
+import ROUTES from '../../../constants/core/routes';
 
-import SettingsLayout from '../../components/layouts/settings.vue';
+import SettingsLayout from '../../../components/layouts/settings.vue';
 
 import {
     defineComponent,
@@ -24,7 +24,7 @@ import {
 import {
     state,
     removeLocation
-} from '../../store';
+} from '../../../store';
 
 export default defineComponent({
     

client/src/routes/settings/sections.vue → client/src/routes/settings/forecast/sections.vue

@@ -12,10 +12,10 @@
 </template>
 
 <script lang="ts">
-import ROUTES from '../../constants/core/routes';
-import FORECAST_SECTIONS from '../../constants/forecast/sections';
+import ROUTES from '../../../constants/core/routes';
+import FORECAST_SECTIONS from '../../../constants/forecast/sections';
 
-import SettingsLayout from '../../components/layouts/settings.vue';
+import SettingsLayout from '../../../components/layouts/settings.vue';
 
 import {
     defineComponent,
@@ -26,7 +26,7 @@ import {
     state,
     moveSection,
     setSectionVisibility
-} from '../../store';
+} from '../../../store';
 
 export default defineComponent({
     

client/src/routes/settings/about.vue → client/src/routes/settings/general/about.vue

@@ -45,12 +45,12 @@
 </template>
 
 <script lang="ts">
-import ROUTES from '../../constants/core/routes';
+import ROUTES from '../../../constants/core/routes';
 
-import SettingsLayout from '../../components/layouts/settings.vue';
+import SettingsLayout from '../../../components/layouts/settings.vue';
 
-import manifest from '../../../package.json';
-import logo from '../../assets/images/logo/logo-192.svg';
+import manifest from '../../../../package.json';
+import logo from '../../../assets/images/logo/logo-192.svg';
 
 import {
     defineComponent