@iankibetsh/vue-streamline 1.1.8 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iankibetsh/vue-streamline",
-  "version": "1.1.8",
+  "version": "1.2.0",
   "description": "Vue library for streamlining laravel backend services with @iankibet/streamline composer package",
  "type": "module",
   "scripts": {

package/src/App.vue

@@ -2,7 +2,7 @@
 import useStreamline from './composables/useStreamline.js'
 import { onMounted, ref, toRefs } from 'vue'
 
-const {loading, service:paybillService, getActionUrl} = useStreamline('mpesa/paybill',32)
+const {loading, service:paybillService, getActionUrl,props} = useStreamline('mpesa/paybill')
 
 
 const foundPaybill = ref(null)
@@ -21,8 +21,9 @@ const findPaybill = async ()=>{
 <template>
   <div>
     <hr/>
+    <h3>Destructed: {{ testKey }}</h3>
+    <h3>Original: {{ props.testKey }}</h3>
     <h3 class="text-success" >Loading : {{ loading }}</h3>
-    <h5>Found Paybill : {{ paybillService.paybill }}</h5>
     <h1 @click="findPaybill">Get Paybill</h1>
     {{ foundPaybill }}
   </div>

package/src/composables/useStreamline.js

@@ -14,6 +14,20 @@ const useStreamline = (stream, ...initialArgs) => {
     const streamlineHeaders = inject('streamlineHeaders');
     const enableCache = inject('enableCache');
 
+    const originalProps = reactive({});
+
+// Proxy to intercept access
+    const props = new Proxy(originalProps, {
+        get(target, property, receiver) {
+            if(!propertiesFetched.value) {
+                fetchServiceProperties().then(() => target[property]);
+            }
+            return Reflect.get(target, property, receiver); // Return the actual value
+        },
+        set(target, property, value, receiver) {
+            return Reflect.set(target, property, value, receiver); // Update the value
+        }
+    })
     const axios = Axios.create({
         headers: {
             ...streamlineHeaders,
@@ -31,7 +45,7 @@ const useStreamline = (stream, ...initialArgs) => {
                 stream,
                 params: initialArgs,
             });
-            assignPropertiesAndMethods(response.data);
+            assignProperties(response.data);
             enableCache && localStorage.setItem(cacheKey, JSON.stringify(response.data));
         } catch (error) {
             console.error(`Error fetching properties for stream ${stream}`, error);
@@ -43,37 +57,13 @@ const useStreamline = (stream, ...initialArgs) => {
         }
     };
 
-    const assignPropertiesAndMethods = (data) => {
+    const assignProperties = (data) => {
         Object.assign(service, data.properties); // Assign the properties to the reactive service object
-        for (const method of data.methods) {
-            const fn = async (...args) => {
-                loading.value = true;
-                try {
-                    const response = await axios.post(streamlineUrl, {
-                        action: method,
-                        stream,
-                        ...formData,
-                        params: args,
-                    });
-                    return response.data;
-                } catch (error) {
-                    console.error(`Error calling ${method} on stream ${stream}`, error);
-                    throw error;
-                } finally {
-                    loading.value = false;
-                }
-            };
-            service[method] = fn;
-        }
+        Object.assign(originalProps, data.properties); // Assign the properties to the reactive service object
     };
 
     const handler = {
         get(target, prop, receiver) {
-            // Fetch properties if not already fetched
-            if (!propertiesFetched.value && !loading.value) {
-                fetchServiceProperties().then(() => target[prop]);
-            }
-
             // Handle existing properties
             if (prop in target) {
                 return target[prop];
@@ -102,7 +92,7 @@ const useStreamline = (stream, ...initialArgs) => {
     };
 
     const getActionUrl = (action, ...args) => {
-        console.log('getActionUrl called with:', action, args);
+        // console.log('getActionUrl called with:', action, args);
         const post = {
             action,
             stream,
@@ -117,7 +107,7 @@ const useStreamline = (stream, ...initialArgs) => {
         if (!enableCache) return;
         const cachedData = localStorage.getItem(cacheKey);
         if (cachedData) {
-            assignPropertiesAndMethods(JSON.parse(cachedData));
+            assignProperties(JSON.parse(cachedData));
         }
         if (initialArgs.length > 0) {
             fetchServiceProperties();
@@ -129,6 +119,7 @@ const useStreamline = (stream, ...initialArgs) => {
         loading,
         service: new Proxy(service, handler),
         getActionUrl,
+        props
     };
 };
 

package/src/main.js

@@ -11,7 +11,7 @@ const app = createApp(App)
 app.use(streamline,{
     streamlineHeaders,
     streamlineUrl,
-    enableCache: true
+    enableCache: false
 })
 
 app.mount('#app')