mango-cms 0.2.23 → 0.2.25

package/default/mango/automation/index.js

@@ -7,6 +7,8 @@ Date.prototype.monthDays = function () {
 
 let startAutomations = function () {
 
+    let now = new Date()
+
     // console.log('starting!')
 
     setInterval(() => {

package/default/package.json

@@ -25,7 +25,7 @@
         "dayjs": "^1.10.7",
         "express": "^4.18.1",
         "google-maps": "^4.3.3",
-        "mango-cms": "^0.2.23",
+        "mango-cms": "^0.2.25",
         "mapbox-gl": "^2.7.0",
         "sweetalert2": "^11.4.0",
         "vite": "^6.2.2",
@@ -35,7 +35,8 @@
         "vue-upload-component": "^3.1.2",
         "vue3-clipboard": "^1.0.0",
         "vue3-touch-events": "^4.1.0",
-        "vuedraggable": "^4.1.0"
+        "vuedraggable": "^4.1.0",
+        "socket.io-client": "^4.8.1"
     },
     "devDependencies": {
         "autoprefixer": "^10.4.0",

package/default/public/swBustCache.js

@@ -0,0 +1,10 @@
+self.addEventListener('message', (event) => {
+    if (event.data && event.data.type === 'CLEAR_CACHE') {
+        caches.keys().then((cacheNames) => {
+            cacheNames.forEach((cacheName) => {
+                caches.delete(cacheName);
+            });
+        });
+        console.log('BUSTED cache')
+    }
+});

package/default/public/swNetworkFirst.js

@@ -0,0 +1,30 @@
+self.addEventListener('fetch', (event) => {
+    if (event.request.method === 'GET' && event.request.url.startsWith('http')) {
+        // Check if the request URL contains '/opportunities'
+        if (event.request.url.includes('/opportunities') || event.request.url.includes('/rhdiStats')) {
+            // If it does, respond with the network request directly without caching
+            event.respondWith(fetch(event.request));
+        } else {
+            event.respondWith(
+                caches.match(event.request).then((cachedResponse) => {
+                    const fetchPromise = fetch(event.request).then((networkResponse) => {
+                        // Clone the network response before consuming it
+                        const clonedResponse = networkResponse.clone();
+
+                        // If the network request is successful, update the cache
+                        caches.open('user-data-cache').then((cache) => {
+                            cache.put(event.request, clonedResponse);
+                        });
+                        return networkResponse;
+                    }).catch(() => {
+                        // If the network request fails, return the cached response (if available)
+                        return cachedResponse;
+                    });
+
+                    // Return the cached response immediately if available, or the network response if not
+                    return cachedResponse || fetchPromise;
+                })
+            );
+        }
+    }
+});

package/default/src/helpers/localDB.js

@@ -1,5 +1,5 @@
 import axios from "axios"
-import Mango from "./mango"
+// import Mango from "./mango"
 import Swal from "sweetalert2"
 
 // Function for setting cookies
@@ -73,7 +73,7 @@ export default class LocalDB {
 
     }
 
-    async save(entry, syncing) {
+    async save(mangoSave, entry, options = {}) {
 
         if (!this.ready) return
 
@@ -102,18 +102,23 @@ export default class LocalDB {
 
             if (existingEntry) entry = { ...existingEntry, ...entry }
 
+            // Handle if the field is an image or array of images
+            let imageFields = {}
+            for (let key in entry) {
+                if (entry[key]?.type?.includes?.('image') || entry[key]?.type?.includes?.('array') && entry[key]?.[0]?.type?.includes?.('image')) {
+                    imageFields[key] = entry[key]
+                    delete entry[key]
+                }
+            }
+
             // Remove Vue Proxy stuff so indexedDB is happy
-            let savedImage = entry.image
-            delete entry.image
             entry = JSON.parse(JSON.stringify(entry))
-            if (!syncing) entry.updatedLocally = new Date()
-
-            // Format Address for offline
-            // if (!entry.address?.id && entry.address?.formatted) entry.address = entry.address.formatted
+            if (!options.syncing) entry.updatedLocally = new Date()
 
-            // Handle images
-            if (savedImage?.type?.includes?.('image')) entry.image = savedImage
-            if (savedImage?.includes?.('http')) entry.image = savedImage
+            // Add images back in after json formatting
+            for (let key in imageFields) {
+                entry[key] = imageFields[key]
+            }
 
 
             let method = entryExists ? 'put' : 'add'
@@ -152,15 +157,26 @@ export default class LocalDB {
 
                     delete entry.updatedLocally
 
+                    // // Save to Mango (timeout if already created, else no timeout)
+                    // let response
+                    // if (onlyLocal) {
+                    //     response = await Mango[this.collection].save(entry, { bypassLocal: true })
+                    //     // if (warnings?.length) Swal.fire('WARNING:', warnings?.join(', '), 'warning')
+                    //     // console.log('mangoResponse', mangoResponse)
+                    //     // response = mangoResponse
+                    // }
+                    // else response = await runWithTimeout(async () => await Mango[this.collection].save(entry, { bypassLocal: true }), 5000)
+
+
                     // Save to Mango (timeout if already created, else no timeout)
                     let response
                     if (onlyLocal) {
-                        let { response: mangoResponse, warnings } = await Mango[this.collection].save(entry, null, true)
-                        if (warnings?.length) Swal.fire('WARNING:', warnings?.join(', '), 'warning')
-                        console.log('mangoResponse', mangoResponse)
-                        response = mangoResponse
+                        response = await mangoSave(entry, { bypassLocal: true })
+                        // if (warnings?.length) Swal.fire('WARNING:', warnings?.join(', '), 'warning')
+                        // console.log('mangoResponse', mangoResponse)
+                        // response = mangoResponse
                     }
-                    else response = await runWithTimeout(async () => await Mango[this.collection].save(entry), 5000)
+                    else response = await runWithTimeout(async () => await mangoSave(entry, { bypassLocal: true }), 5000)
 
                     // If successfull, delete from local queue
                     if (response?.id) {

package/default/src/helpers/mango.js

@@ -5,6 +5,11 @@ import { algoliaAppId, algoliaSearchKey, algoliaIndex, port, mangoDomain, useDev
 import axios from "axios";
 import { ref } from 'vue'
 import algoliasearch from 'algoliasearch/dist/algoliasearch-lite.esm.browser'
+import LocalDB from './localDB'
+import { io } from 'socket.io-client';
+
+import { useRoute } from 'vue-router'
+let route = useRoute()
 
 let endpoints = {
     authors: ['get'],
@@ -48,6 +53,8 @@ function getQuery(params) {
 
 const Mango = collections.reduce((a, c) => {
 
+    let localDB = new LocalDB(c.name, api)
+
     let runQuery = ({ limit, page, search, fields, id, sort, depthLimit, verbose } = {}) => {
 
         let fullQuery
@@ -121,7 +128,8 @@ const Mango = collections.reduce((a, c) => {
 
     }
 
-    let save = (data, options = {}) => {
+    let mangoSave = (data, options = {}) => {
+
         let { id } = data
         let method = id ? 'put' : 'post'
 
@@ -152,6 +160,11 @@ const Mango = collections.reduce((a, c) => {
         })
     }
 
+    let save = (data, options = {}) => {
+        if (!options.bypassLocal) return localDB.save(save, data, options)
+        else return mangoSave(data, options)
+    }
+
     let deleteEntry = (data) => {
         let id = data.id || data
 
@@ -164,10 +177,77 @@ const Mango = collections.reduce((a, c) => {
         })
     }
 
+
+    let sync = () => {
+
+        let remainingEntries = ref([])
+        let syncedEntries = ref([])
+        let online = ref(navigator.onLine)
+        let syncing = ref(false)
+
+        setInterval(async () => {
+
+            // console.log('syncing', syncing.value, route?.params?.id)
+            online.value = navigator.onLine
+
+            if (syncing.value) return
+
+            syncing.value = true
+
+            let entries = await localDB.getEntries()
+            remainingEntries.value = entries?.filter(e => (new Date() - new Date(e.updatedLocally)) > 30*1000)
+
+            for (let [index, entry] of remainingEntries.value.entries()) {
+
+                // Don't sync what we're actively working on
+                if (route?.params?.id == entry.id || (!isNaN(entry.id) && window.location.pathname.includes(`/${entry.id}`))) {
+                    console.log('skipping', entry.id)
+                    continue
+                }
+
+                try {
+                    let response = await save(entry, {syncing: true})
+                    if (response?.id) remainingEntries.value.splice(index, 1)
+                } catch(e) {
+                    console.log('Error saving entry', e, entry)
+                }
+
+                await new Promise(resolve => setTimeout(resolve, 10*1000))
+
+            }
+
+            syncing.value = false
+            syncedEntries.value = []
+
+        }, 500)
+
+
+        return { remainingEntries, syncedEntries, online, syncing }
+
+    }
+
+    let subscribe = (callback, room) => {
+        let socket = io(`${api}/${c.name}`, { transports: ['websocket'] })
+        let userId = window.localStorage.getItem('auth').split(':')[1]
+        room = room || userId
+        socket.emit('subscribeToThread', room)
+        if (callback) socket.on('message', callback)
+    }
+
     a[c.name] = runQuery
     a[c.name]['save'] = save
     a[c.name]['delete'] = deleteEntry
+    a[c.name]['subscribe'] = subscribe
     a[c.singular] = (id, query) => runQuery({ id, ...query })
+    a[c.singular]['subscribe'] = (id, callback) => {
+        if (!id) return console.error('No id provided')
+        return subscribe(callback, id)
+    }
+
+    a[c.name]['local'] = localDB.getEntries
+    a[c.singular]['local'] = localDB.get
+    a[c.singular]['local']['delete'] = localDB.delete
+    a[c.name]['sync'] = sync
 
     a[c.name]['search'] = runAlgolia
     a[c.name]['search']['init'] = (search, query, algoliaFilters) => {

package/default/src/helpers/syncEntries.vue

@@ -0,0 +1,50 @@
+<template>
+    <div class="flex justify-between items-center bg-merlin-500/40 backdrop-blur-sm fixed top-0 left-0 w-full z-50">
+
+        <div v-if="remainingEntries.length" class="w-full px-4 py-2 flex justify-between relative">
+            <div>Syncing:</div>
+            <div>{{ syncedEntries.length }}/{{ remainingEntries.length + syncedEntries.length }}</div>
+
+            <div class="h-1 bg-red-500 absolute -bottom-1 left-0" :style="`width: ${progress}%;`" />
+        </div>
+
+    </div>
+</template>
+
+<script>
+import Toggle from '../partials/toggle.vue'
+
+export default {
+	components: { Toggle },
+    inject: ['store'],
+    data() {
+        return {
+            remainingEntries: [],
+            online: navigator.onLine,
+            syncing: false,
+            syncedEntries: [],
+        }
+    },
+    beforeDestroy() {
+        // clearInterval(this.onlineInterval)
+    },
+    async mounted() {
+
+        let response = this.$mango.opportunities.sync()
+        this.online = response.online
+        this.syncing = response.syncing
+        this.remainingEntries = response.remainingEntries
+        this.syncedEntries = response.syncedEntries
+
+    },
+    computed: {
+        progress() {
+            return Math.round(this.syncedEntries.length / (this.remainingEntries.length+this.syncedEntries.length) * 100)
+        }
+    }
+}
+</script>
+
+<style>
+
+</style>

package/default/vite.config.js

@@ -1,5 +1,6 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
+// import { VitePWA } from 'vite-plugin-pwa'
 import path from 'path'
 import fs from 'fs'
 
@@ -24,6 +25,20 @@ const collectionsPath = path.resolve(configPath, 'config/.collections.json')
 export default defineConfig({
 	plugins: [
 		vue(),
+        // VitePWA({
+        //     registerType: 'autoUpdate',
+        //     includeAssets: ['images/*.jpg'],
+        //     // devOptions: {
+        //     //     enabled: true,
+        //     // },
+        //     workbox: {
+        //         importScripts: [
+        //             '/swBustCache.js',
+        //             '/swNetworkFirst.js?v=6'
+        //         ],
+        //         // globPatterns: ['**/*.{js,css,html,ico,png,svg,vue,jpg,jpeg}']
+        //     }
+        // }),
 		{
 			name: 'watch-collections',
 			configureServer(server) {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "mango-cms",
-    "version": "0.2.23",
+    "version": "0.2.25",
     "main": "./index.js",
     "exports": {
         ".": "./index.js",