Release skip project config etc

config/data/_workspace.graphql

@@ -11,6 +11,7 @@ query ($locale: SiteLocale, $id: ItemId){
     accentColor {
       hex
     }
+    skipAreaSettings,
     excludeAllMeasures,
     showRivmCoBenefits,
     showHeatstress,

src/client/components/area-property-radio/area-property-radio.vue

@@ -0,0 +1,92 @@
+<template>
+  <fieldset>
+    <legend class="area-property-radio__label">
+      {{ $t(`area_${valueTypeLower}`) }}
+      <app-tooltip
+        :message="$t(`area_${ valueTypeLower }_info`)"
+        class="area-property-radio__info"
+        direction="left"
+      />
+    </legend>
+    <md-radio
+      v-for="option in options"
+      :key="option"
+      v-model="internalValue"
+      :name="valueType"
+      :value="option"
+      @change="update(option)"
+    >
+      {{ $t(`area_${ valueTypeLower }_${option}`) }}
+    </md-radio>
+  </fieldset>
+</template>
+
+<script>
+import AppTooltip from '@/components/app-tooltip'
+
+export default {
+  components: {
+    AppTooltip,
+  },
+  props: {
+    valueType: {
+      type: String,
+      required: true,
+    },
+    value: {
+      type: String,
+      required: true,
+    },
+    options: {
+      type: Array,
+      required: true,
+    },
+  },
+  data: () => ({
+    internalValue: null,
+  }),
+  computed: {
+    valueTypeLower() {
+      return this.valueType.toLowerCase()
+    },
+  },
+  watch: {
+    value(newVal, oldVal) {
+      if(newVal === oldVal) return
+      this.updateInternal()
+    },
+  },
+  created() {
+    this.updateInternal()
+  },
+  methods: {
+    updateInternal() {
+      this.internalValue = this.value
+    },
+    update(value) {
+      this.$emit('change', {
+        key: this.valueType,
+        value,
+      })
+    },
+  },
+}
+</script>
+
+<style>
+.aoperty-radio:focus-within .area-property-radio__label {
+  color: var(--md-theme-default-primary);
+}
+
+.area-property-radio__label {
+  position: relative;
+  display: block;
+  font-size: var(--font-size-extra-small);
+  color: rgba(0,0,0,0.54);
+}
+.area-property-radio__info {
+  position: absolute;
+  top: -9px;
+  right: -40px;
+}
+</style>

src/client/components/area-property-radio/index.js

@@ -0,0 +1,2 @@
+import Component from './area-property-radio.vue'
+export default Component

src/client/components/kpi-table/kpi-table.vue

@@ -25,14 +25,25 @@
           </md-table-head>
         </md-table-row>
 
-        <template v-if="table.rows">
+        <template v-for="(header, i) in table.rowSetHeaders">
           <md-table-row
-            v-for="(row, index) in table.rows"
-            :key="index"
+            v-if="table.rowSetHeaders.length > 1"
+            :key="`row-heading-${header}`"
+          >
+            <md-table-head
+              :colspan="table.header.length"
+              scope="colgroup"
+            >
+              {{ $t(`area_actor_${header}`) }}
+            </md-table-head>
+          </md-table-row>
+          <md-table-row
+            v-for="(row, j) in table.rowSets[i]"
+            :key="`row-${i}-${j}`"
           >
             <md-table-cell
-              v-for="(value, rowIndex) in row"
-              :key="rowIndex"
+              v-for="(value, k) in row"
+              :key="`cell-${i}-${j}-${k}`"
             >
               {{ value }}
             </md-table-cell>

src/client/components/measure-list/measure-list.vue

@@ -76,6 +76,7 @@
             </svg>
           </md-button>
           <md-button
+            v-if="hasSuitabilityRankings"
             :class="{'md-accent': sortType === SYSTEM_SUITABILITY}"
             class="md-icon-button"
             @click="sortType = SYSTEM_SUITABILITY"
@@ -157,7 +158,7 @@ export default {
     SYSTEM_SUITABILITY,
     ALPHA,
     searchValue: '',
-    sortType: SYSTEM_SUITABILITY,
+    sortType: ALPHA,
     sorting: ['featured'],
   }),
   computed: {
@@ -179,6 +180,10 @@ export default {
       })
       return [...sorted, ...withoutSuitablility]
     },
+    hasSuitabilityRankings() {
+      // If the first measure does not have a systemSuitability value, then none of them do
+      return !isNaN(Number(this.measures[0].systemSuitability))
+    },
     alphaSortedMeasures() {
       return [...this.measures].sort((a, b) => {
         if (a.title > b.title) {
@@ -230,6 +235,11 @@ export default {
       return searchFiltered(this.featureSorted)
     },
   },
+  mounted() {
+    if (this.hasSuitabilityRankings) {
+      this.sortType = SYSTEM_SUITABILITY
+    }
+  },
   methods: {
     choose(value) {
       this.$emit('choose', value)

src/client/lib/area-actors.js

@@ -0,0 +1,2 @@
+export const ACTORS = ['public', 'private']
+export const DEFAULT_ACTOR = 'public'

src/client/lib/export-to-pdf.js

@@ -1,5 +1,4 @@
 import log from '../lib/log'
-import b63ToBlob from '../lib/b64-to-blob';
 
 if (process.browser) {
   window.addProject = async function (projectData, title) {
@@ -33,20 +32,18 @@ export default function exportToPdf({ locale, project, title }) {
       iframe.style.height = '297mm'
       iframe.addEventListener('load', () => {
         log.groupEnd()
-        log.groupStart.info('Creating PDF')
-        dispatch('Iframe loaded', 1/7)
+        log.groupStart.info('Creating View')
+        dispatch('Iframe loaded', 1 / 5)
         iframe.contentWindow.document.addEventListener('mapbox-loaded', async () => {
-          dispatch('MapBox loaded', 2/7)
+          dispatch('MapBox loaded', 2 / 5)
           await iframe.contentWindow.window.addProject(JSON.stringify(project), title)
-          dispatch('Project added', 3/7)
+          dispatch('Project added', 3 / 5)
           iframe.contentWindow.document.addEventListener('mapbox-image-created', async () => {
-            dispatch('MapBox Image created', 4/7)
-            ;[...iframe.contentWindow.document.querySelectorAll('script')].forEach(scriptElement => {
-              scriptElement.parentNode.removeChild(scriptElement)
-            })
-            resolve(iframe.contentWindow.document.documentElement.outerHTML)
-            dispatch('Removing iframe', 5/7)
-            iframe.parentElement.removeChild(iframe)
+            dispatch('MapBox Image created', 4 / 5)
+              ;[...iframe.contentWindow.document.querySelectorAll('script')].forEach(scriptElement => {
+                scriptElement.parentNode.removeChild(scriptElement)
+              })
+            resolve(iframe)
           })
         })
       })
@@ -56,27 +53,21 @@ export default function exportToPdf({ locale, project, title }) {
       throw new Error(error)
     }
   })
-  .then(markup => {
-    dispatch('Sending markup to server', 6/7)
-    return fetch('/.netlify/functions/export-to-pdf-from-markup', {
-        method: 'POST',
-        body: markup,
-      })
-      .then(async res => {
-        if (res.ok) {
-          return await res.json()
-        } else {
-          throw new Error(`Failed to receive PDF response from server (${res.status}). ${res.statusText}`)
-        }
-      })
-  })
-  .then(({ pdf }) => {
-    dispatch('Received PDF response from server', 7/7)
+  .then(iframe => {
+    dispatch('Present print dialog', 5 / 5)
+    const titleToRestore = document.title
+    // Overwrite title to set filename for print dialog
+    document.title = title
+    iframe.contentDocument.title = title
+    iframe.contentWindow.print()
+    document.title = titleToRestore
     log.groupEnd()
-    return b63ToBlob(pdf, 'application/pdf')
+    iframe.remove()
+    return
   })
   .catch(error => {
     log.groupEnd()
     log.error(error.message, error)
+
   })
 }

src/client/pages/project/areas.vue

@@ -68,7 +68,14 @@
               </div>
             </div>
 
-            <template v-if="selectedMeasure">
+            <template v-if="selectedMeasureId && selectedMeasure">
+              <area-property-radio
+                :value="actor"
+                :options="ACTORS"
+                value-type="actor"
+                @change="({ _, value }) => actor = value"
+              />
+
               <area-property-slider
                 v-for="({ key, min, max, values, unit }) in measurePropertiesToEdit"
                 :key="key"
@@ -94,15 +101,18 @@
 </template>
 
 <script>
-import { mapGetters, mapActions, mapMutations, mapState } from 'vuex';
-import MapEventBus, { REDRAW, MODE, DELETE } from '@/lib/map-event-bus';
+import { mapGetters, mapActions, mapMutations, mapState } from 'vuex'
+import { ACTORS, DEFAULT_ACTOR } from '@/lib/area-actors'
+import MapEventBus, { REDRAW, MODE, DELETE } from '@/lib/map-event-bus'
 import isNil from '@/lib/isNil'
+import AreaPropertyRadio from '@/components/area-property-radio'
 import AreaPropertySlider from '@/components/area-property-slider'
 import TextInput from '@/components/text-input'
 
 export default {
   middleware: ['access-level-settings'],
-  components: { TextInput, AreaPropertySlider },
+  components: { TextInput, AreaPropertyRadio, AreaPropertySlider },
+  data: () => ({ ACTORS }),
   computed: {
     ...mapState('i18n', ['locale']),
     ...mapGetters('data/measures', ['measureById']),
@@ -145,6 +155,25 @@ export default {
       return this.measureById(this.selectedMeasureId)
     },
 
+    actor: {
+      get() {
+        const isConsistentSelectionValue = this.selectedFeatures
+          .every(({ properties: { actor } }, _, arr) => actor === arr[0].properties.actor)
+
+        return isConsistentSelectionValue
+          ? this.selectedFeatures[0].properties.actor || DEFAULT_ACTOR
+          : '' // Leave empty if not all selected features have the same value
+      },
+      set(value) {
+        this.updateAreaProperties({
+          features: this.selectedFeatures,
+          properties: {
+            actor: value,
+          },
+        })
+      },
+    },
+
     selectedGeometryTypes() {
       return this.selectedFeatures.reduce((returnArr, { geometry: { type } }) => {
         return returnArr.includes(type) ? returnArr : [...returnArr, type]

src/client/pages/project/measures/_slug.vue

@@ -2,7 +2,6 @@
   <div class="measure">
     <back-button class="measure__top" comp="div">
       <md-button
-        :disabled="!selectedFeatures.length"
         class="md-raised md-accent"
         @click="() => onChoose(measure)"
       >
@@ -61,9 +60,20 @@ export default {
   },
   methods: {
     ...mapActions({ setAreaMeasure: 'project/setAreaMeasure' }),
+    ...mapActions({
+      chooseMeasure: 'setMeasureFlow/chooseMeasure',
+      startFlow: 'setMeasureFlow/startFlow',
+    }),
     onChoose(measure) {
-      this.setAreaMeasure({ features: this.selectedFeatures, measure })
-      this.$router.push(`/${this.$i18n.locale}/project/areas/`).catch(() => {})
+      if (this.selectedFeatures.length) {
+        // set measure to selected features
+        this.setAreaMeasure({ features: this.selectedFeatures, measure })
+        this.$router.push(`/${this.$i18n.locale}/project/areas/`).catch(() => {})
+      } else {
+        // go to drawing mode in set-measure-flow
+        this.startFlow()
+        this.chooseMeasure(measure.measureId)
+      }
     },
     back() {
       this.$router.back()

src/client/pages/set-measure.vue

@@ -32,7 +32,9 @@ export default {
     ...mapGetters('setMeasureFlow', ['activeStep']),
   },
   mounted() {
-    this.startFlow()
+    if (!this.currentStep) {
+      this.startFlow()
+    }
   },
   destroyed() {
     this.resetFlow({ relocate: false })

src/client/pages/settings/project-area.vue

@@ -138,7 +138,7 @@ export default {
     }),
     ...mapGetters({
       projectAreaSettings: 'project/settingsProjectArea',
-      areaSettings: 'data/areaSettings/overriddenAreaSettings',
+      areaSettings: 'data/areaSettings/requiredAreaSettings',
       scenariosInActiveWorkspace: 'data/workspaces/scenariosInActiveWorkspace',
       activeWorkspace: 'data/workspaces/activeWorkspace',
     }),

src/client/store/data/areaSettings.js

@@ -18,8 +18,25 @@ export const actions = {
 }
 
 export const getters = {
+  requiredAreaSettings(state, getters, rootState, rootGetters) {
+    const overriddenAreaSettings = getters.overriddenAreaSettings
+    const skipAreaSettings = rootGetters['data/workspaces/skipAreaSettings']
+
+    const scenarioNameSetting = overriddenAreaSettings.find(({ key }) => key === 'scenarioName');
+
+    if (skipAreaSettings) {
+      return [scenarioNameSetting]
+    }
+
+    return overriddenAreaSettings
+  },
   overriddenAreaSettings(state, getters, rootState, rootGetters) {
     const activeWorkspace = rootGetters['data/workspaces/activeWorkspace']
+
+    if (!activeWorkspace) {
+      return state
+    }
+
     return state.map(item => {
       const { options, defaultValue, ...itemRest } = item
       const { key } = itemRest