fixed global messages for services

.github/workflows/dev.yml

@@ -35,13 +35,6 @@ jobs:
           echo ::set-env name=VERSION::$(cat version.txt)
         shell: bash
 
-      - name: Font Awesome authentication
-        env:
-          FONTAWESOME_TOKEN: ${{ secrets.FONTAWESOME_TOKEN }}
-        run: |
-          npm config set "@fortawesome:registry" https://npm.fontawesome.com/
-          npm config set "//npm.fontawesome.com/:_authToken" $FONTAWESOME_TOKEN
-
       - name: Install Global Dependencies
         run: npm install -g yarn sass cross-env
 
@@ -69,7 +62,7 @@ jobs:
       - name: Upload Assets to S3
         run: |
           tar -czvf source.tar.gz source/
-          aws s3 cp source.tar.gz s3://assets.statping.com/
+          aws s3 cp source.tar.gz s3://assets.statping.com/${{ env.GITHUB_SHA }}
           rm -rf source.tar.gz
 
   test:
@@ -124,6 +117,7 @@ jobs:
       - name: Install Statping
         env:
           VERSION: ${{ env.VERSION }}
+          COMMIT: ${{ env.GITHUB_SHA }}
         run: |
           make build certs
           chmod +x statping
@@ -135,7 +129,7 @@ jobs:
           gotestsum --no-summary=skipped --format dots -- -covermode=count -coverprofile=coverage.out -p=1 ./...
         env:
           VERSION: ${{ env.VERSION }}
-          COMMIT: ${{ github.sha }}
+          COMMIT: ${{ env.GITHUB_SHA }}
           DB_CONN: sqlite3
           STATPING_DIR: ${{ github.workspace }}
           API_SECRET: demopassword123
@@ -196,6 +190,7 @@ jobs:
       - name: Install Statping
         env:
           VERSION: ${{ env.VERSION }}
+          COMMIT: ${{ env.GITHUB_SHA }}
         run: |
           make build
           chmod +x statping
@@ -251,6 +246,7 @@ jobs:
       - name: Install Statping
         env:
           VERSION: ${{ env.VERSION }}
+          COMMIT: ${{ env.GITHUB_SHA }}
           MJML_APP: ${{ secrets.MJML_APP }}
           MJML_PRIVATE: ${{ secrets.MJML_PRIVATE }}
         run: |
@@ -309,7 +305,7 @@ jobs:
       - name: Install Statping
         env:
           VERSION: ${{ env.VERSION }}
-          COMMIT: ${{ github.sha }}
+          COMMIT: ${{ env.GITHUB_SHA }}
         run: |
           make build
           chmod +x statping
@@ -382,7 +378,7 @@ jobs:
       - name: Build Binaries
         env:
           VERSION: ${{ env.VERSION }}
-          COMMIT: ${{ github.sha }}
+          COMMIT: ${{ env.GITHUB_SHA }}
           MJML_APP: ${{ secrets.MJML_APP }}
           MJML_PRIVATE: ${{ secrets.MJML_PRIVATE }}
         run: make build-folders build-linux build-linux-arm build-darwin build-win compress-folders
@@ -460,11 +456,11 @@ jobs:
       - name: Docker Build :base
         env:
           VERSION: ${{ env.VERSION }}
-          COMMIT: ${{ github.sha }}
+          COMMIT: ${{ env.GITHUB_SHA }}
         run: make buildx-base
 
       - name: Docker Build :dev
         env:
           VERSION: ${{ env.VERSION }}
-          COMMIT: ${{ github.sha }}
+          COMMIT: ${{ env.GITHUB_SHA }}
         run: make buildx-dev

frontend/src/components/Dashboard/DashboardIndex.vue

@@ -25,6 +25,15 @@
             </div>
         </div>
 
+      <div v-for="message in messagesInRange" class="bg-light shadow-sm p-3 pr-4 pl-4 col-12 mb-4">
+        <font-awesome-icon icon="calendar" class="mr-3" size="1x"/> {{message.description}}
+        <span class="d-block small text-muted mt-3">
+        Starts at <strong>{{niceDate(message.start_on)}}</strong> till <strong>{{niceDate(message.end_on)}}</strong>
+        ({{dur(parseISO(message.start_on), parseISO(message.end_on))}})
+      </span>
+      </div>
+
+
         <div v-for="(service, index) in services" class="service_block" v-bind:key="index">
             <ServiceInfo :service=service />
         </div>
@@ -32,6 +41,10 @@
 </template>
 
 <script>
+  import isAfter from "date-fns/isAfter";
+  import parseISO from "date-fns/parseISO";
+  import isBefore from "date-fns/isBefore";
+
   const ServiceInfo = () => import(/* webpackChunkName: "dashboard" */ '@/components/Dashboard/ServiceInfo')
 
   export default {
@@ -45,6 +58,9 @@
         }
     },
       computed: {
+        messagesInRange() {
+          return this.$store.getters.globalMessages.filter(m => this.isAfter(this.now(), m.start_on) && this.isBefore(this.now(), m.end_on))
+        },
           services() {
               return this.$store.getters.services
           }

frontend/src/components/Dashboard/ServiceEvents.vue

@@ -9,7 +9,7 @@
         <span class="d-block text-dim float-right small mt-3 mb-1">Failure #{{failure.id}}</span>
       </code>
     </div>
-    <div v-if="loaded" v-for="message in messages" class="bg-light shadow-sm p-3 pr-4 pl-4 col-12 mt-3">
+    <div v-if="loaded" v-for="message in $store.getters.serviceMessages(service.id)" class="bg-light shadow-sm p-3 pr-4 pl-4 col-12 mt-3">
       <font-awesome-icon icon="calendar" class="mr-3" size="1x"/> {{message.description}}
       <span class="d-block small text-muted mt-3">
         Starts at <strong>{{niceDate(message.start_on)}}</strong> till <strong>{{niceDate(message.end_on)}}</strong>
@@ -44,7 +44,6 @@ name: "ServiceEvents",
   },
   data() {
     return {
-      messages: null,
       incidents: null,
       failure: null,
       loaded: false,
@@ -53,6 +52,11 @@ name: "ServiceEvents",
   mounted() {
    this.load()
   },
+  computed: {
+    messages() {
+      return this.$store.getters.serviceMessages(this.service.id)
+    }
+  },
   methods: {
     async load() {
       this.loaded = false
@@ -64,7 +68,7 @@ name: "ServiceEvents",
       this.loaded = true
     },
     async getMessages() {
-      this.messages = await Api.messages()
+      // this.messages = this.$store.getters.serviceMessages(this.service.id)
     },
     async getFailure() {
       const f = await Api.service_failures(this.service.id, null, null, 1)
@@ -76,7 +80,3 @@ name: "ServiceEvents",
   }
 }
 </script>
-
-<style scoped>
-
-</style>

frontend/src/mixin.js

@@ -1,9 +1,10 @@
 import Vue from "vue";
-const { startOfToday, startOfMonth, lastDayOfMonth, subSeconds, getUnixTime, fromUnixTime, differenceInSeconds, formatDistance, addMonths, isWithinInterval } = require('date-fns')
+const { startOfToday, startOfMonth, lastDayOfMonth, subSeconds, getUnixTime, fromUnixTime, differenceInSeconds, formatDistance, addMonths, addSeconds, isWithinInterval } = require('date-fns')
 import formatDistanceToNow from 'date-fns/formatDistanceToNow'
 import format from 'date-fns/format'
 import parseISO from 'date-fns/parseISO'
-import addSeconds from 'date-fns/addSeconds'
+import isBefore from 'date-fns/isBefore'
+import isAfter from 'date-fns/isAfter'
 
 export default Vue.mixin({
   methods: {
@@ -19,7 +20,7 @@ export default Vue.mixin({
     startToday() {
       return startOfToday()
     },
-      secondsHumanize (val) {
+    secondsHumanize(val) {
       return `${val} ${this.$t('second', val)}`
     },
     utc(val) {
@@ -34,10 +35,16 @@ export default Vue.mixin({
     nowSubtract(seconds) {
       return subSeconds(new Date(), seconds)
     },
+    isAfter(date, compare) {
+      return isAfter(date, parseISO(compare))
+    },
+    isBefore(date, compare) {
+      return isBefore(date, parseISO(compare))
+    },
     dur(t1, t2) {
       return formatDistance(t1, t2)
     },
-    format(val, type="EEEE, MMM do h:mma") {
+    format(val, type = "EEEE, MMM do h:mma") {
       return format(val, type)
     },
     niceDate(val) {
@@ -84,14 +91,14 @@ export default Vue.mixin({
     },
     copy(txt) {
       this.$copyText(txt).then(function (e) {
-        alert('Copied: \n'+txt)
+        alert('Copied: \n' + txt)
       });
     },
     serviceLink(service) {
       if (service.permalink) {
         service = this.$store.getters.serviceByPermalink(service.permalink)
       }
-      if (service===undefined || this.isEmptyObject(service)) {
+      if (service === undefined || this.isEmptyObject(service)) {
         return `/service/0`
       }
       let link = service.permalink ? service.permalink : service.id
@@ -147,7 +154,7 @@ export default Vue.mixin({
       })
       return newSet
     },
-    convertToChartData(data = [], multiplier=1, asInt=false) {
+    convertToChartData(data = [], multiplier = 1, asInt = false) {
       if (!data) {
         return {data: []}
       }
@@ -178,6 +185,9 @@ export default Vue.mixin({
     },
     addMonths(date, amount) {
       return addMonths(date, amount)
+    },
+    addSeconds(date, amount) {
+      return addSeconds(date, amount)
     }
   }
 });

frontend/src/routes.js

@@ -203,9 +203,9 @@ router.beforeEach((to, from, next) => {
   const nearestWithTitle = to.matched.slice().reverse().find(r => r.meta && r.meta.title);
   const nearestWithMeta = to.matched.slice().reverse().find(r => r.meta && r.meta.metaTags);
   const previousNearestWithMeta = from.matched.slice().reverse().find(r => r.meta && r.meta.metaTags);
-  if(nearestWithTitle) document.title = nearestWithTitle.meta.title;
+  if (nearestWithTitle) document.title = nearestWithTitle.meta.title;
   Array.from(document.querySelectorAll('[data-vue-router-controlled]')).map(el => el.parentNode.removeChild(el));
-  if(!nearestWithMeta) return next();
+  if (!nearestWithMeta) return next();
   nearestWithMeta.meta.metaTags.map(tagDef => {
     const tag = document.createElement('meta');
     Object.keys(tagDef).forEach(key => {

frontend/src/store.js

@@ -52,12 +52,12 @@ export default new Vuex.Store({
     isAdmin: state => state.admin,
     isUser: state => state.user,
 
+    globalMessages: state => state.messages.filter(s => !s.service || s.service === 0),
     servicesInOrder: state => state.services.sort((a, b) => a.order_id - b.order_id),
     servicesNoGroup: state => state.services.filter(g => g.group_id === 0).sort((a, b) => a.order_id - b.order_id),
     groupsInOrder: state => state.groups.sort((a, b) => a.order_id - b.order_id),
     groupsClean: state => state.groups.filter(g => g.name !== '').sort((a, b) => a.order_id - b.order_id),
     groupsCleanInOrder: state => state.groups.filter(g => g.name !== '').sort((a, b) => a.order_id - b.order_id).sort((a, b) => a.order_id - b.order_id),
-
     serviceCheckins: (state) => (id) => {
       return state.checkins.filter(c => c.service_id === id)
     },
@@ -97,49 +97,49 @@ export default new Vuex.Store({
     },
   },
   mutations: {
-        setHasAllData (state, bool) {
+    setHasAllData(state, bool) {
       state.hasAllData = bool
     },
-        setHasPublicData (state, bool) {
+    setHasPublicData(state, bool) {
       state.hasPublicData = bool
     },
-        setCore (state, core) {
+    setCore(state, core) {
       state.core = core
     },
-        setToken (state, token) {
+    setToken(state, token) {
       state.token = token
     },
-        setService (state, service) {
+    setService(state, service) {
       state.service = service
     },
-        setServices (state, services) {
+    setServices(state, services) {
       state.services = services
     },
-        setCheckins (state, checkins) {
+    setCheckins(state, checkins) {
       state.checkins = checkins
     },
-        setGroups (state, groups) {
+    setGroups(state, groups) {
       state.groups = groups
     },
-        setMessages (state, messages) {
+    setMessages(state, messages) {
       state.messages = messages
     },
-        setUsers (state, users) {
+    setUsers(state, users) {
       state.users = users
     },
-        setNotifiers (state, notifiers) {
+    setNotifiers(state, notifiers) {
       state.notifiers = notifiers
     },
-        setAdmin (state, admin) {
+    setAdmin(state, admin) {
       state.admin = admin
     },
-      setLoggedIn (state, loggedIn) {
+    setLoggedIn(state, loggedIn) {
       state.loggedIn = loggedIn
     },
-      setUser (state, user) {
+    setUser(state, user) {
       state.user = user
     },
-      setOAuth (state, oauth) {
+    setOAuth(state, oauth) {
       state.oauth = oauth
     },
   },
@@ -154,7 +154,7 @@ export default new Vuex.Store({
       context.commit("setCore", core);
       context.commit('setAdmin', token)
       context.commit('setCore', core)
-        context.commit('setUser', token!==undefined)
+      context.commit('setUser', token !== undefined)
     },
     async loadRequired(context) {
       const groups = await Api.groups()