@live-change/balance-frontend 0.8.62 → 0.8.63

package/front/src/Balance.vue

@@ -0,0 +1,168 @@
+<template>
+  <div class="w-full">
+    <div class="surface-card shadow-1 border-round p-3 mb-1">
+      <div class="text-xl">Balance: {{ balance.owner }}</div>
+      <div>Amount: {{ balance.amount }}</div>
+      <div>Available: {{ balance.available }}</div>
+    </div>
+    <div class="surface-card shadow-1 border-round p-3 text-xl mb-1 mt-2 text-xl">
+      Operations:
+    </div>
+    <div v-if="startedOperations.length === 0" class="surface-card shadow-1 border-round p-3 mb-1">
+      No operations started
+    </div>
+    <div v-for="operation of startedOperations"
+         class="surface-card shadow-1 border-round mb-1 flex flex-row align-items-center">
+      <div class="flex-1 flex-grow pl-3">
+        {{ operation.cause }}
+      </div>
+      <div class="w-15rem text-right pl-3 font-semibold mr-3">
+        {{ operation.createdAt }}
+      </div>
+      <div class="w-10rem text-right pl-3 font-semibold mr-3"
+           :class="operation.change > 0 ? 'text-green-500' : 'text-red-500'">
+        {{ operation.change > 0 ? '+' : '-' }} {{ Math.abs(operation.change) }}
+      </div>
+      <Button label="Finish" icon="pi pi-check" severity="success"
+              @click="actions.balanceTest.finishOperation({ balance: balance.id, operation: operation.id })" />
+      <Button label="Cancel" icon="pi pi-cross" severity="warning"
+              @click="actions.balanceTest.cancelOperation({ balance: balance.id, operation: operation.id })" />
+
+    </div>
+
+    <div class="flex flex-row">
+      <div class="surface-card shadow-1 border-round p-3 text-xl mt-3 flex-1">
+        <div class="text-xl mb-2">Start operation</div>
+        <command-form service="balanceTest" action="startOperation"
+                      :parameters="{ balance: balance.id }"
+                      v-slot="{ data }" reset-on-done>
+          <div class="col-12 md:col-6 py-1">
+            <div class="p-field mb-3">
+              <label for="email" class="block text-900 font-medium mb-2">
+                Name
+              </label>
+              <InputText id="name" type="text" class="w-full"
+                         aria-describedby="email-help" :class="{ 'p-invalid': data.nameError }"
+                         v-model="data.name" />
+              <small id="email-help" class="p-error">{{ data.nameError }}</small>
+            </div>
+          </div>
+          <div class="col-12 md:col-6 py-1">
+            <div class="p-field mb-3">
+              <label for="email" class="block text-900 font-medium mb-2">
+                Change
+              </label>
+              <InputNumber id="name" type="text" class="w-full" :min="-1000000" :max="1000000" showButtons :step="1000"
+                         aria-describedby="email-help" :class="{ 'p-invalid': data.changeError }"
+                         v-model="data.change" />
+              <small id="email-help" class="p-error">{{ data.changeError }}</small>
+            </div>
+          </div>
+          <Button label="Start operation" icon="pi pi-plus" type="submit" />
+        </command-form>
+      </div>
+      <div class="surface-card shadow-1 border-round p-3 text-xl mt-3 flex-1 ml-2">
+        <div class="text-xl mb-2">Do instant operation</div>
+        <command-form service="balanceTest" action="doOperation"
+                      :parameters="{ balance: balance.id }"
+                      v-slot="{ data }" reset-on-done>
+          <div class="col-12 md:col-6 py-1">
+            <div class="p-field mb-3">
+              <label for="email" class="block text-900 font-medium mb-2">
+                Name
+              </label>
+              <InputText id="name" type="text" class="w-full"
+                         aria-describedby="email-help" :class="{ 'p-invalid': data.nameError }"
+                         v-model="data.name" />
+              <small id="email-help" class="p-error">{{ data.nameError }}</small>
+            </div>
+          </div>
+          <div class="col-12 md:col-6 py-1">
+            <div class="p-field mb-3">
+              <label for="email" class="block text-900 font-medium mb-2">
+                Change
+              </label>
+              <InputNumber id="name" type="text" class="w-full" :min="-1000000" :max="1000000" showButtons :step="1000"
+                           aria-describedby="email-help" :class="{ 'p-invalid': data.changeError }"
+                           v-model="data.change" />
+              <small id="email-help" class="p-error">{{ data.changeError }}</small>
+            </div>
+          </div>
+          <Button label="Do operation" icon="pi pi-plus" type="submit" />
+        </command-form>
+      </div>
+    </div>
+
+    <div class="surface-card shadow-1 border-round p-3 text-xl mb-1 mt-2 text-xl">
+      Finished operations:
+    </div>
+    <div v-if="finishedOperations.length === 0" class="surface-card shadow-1 border-round p-3 mb-1">
+      No operations finished
+    </div>
+    <div v-for="operation of finishedOperations"
+         class="surface-card shadow-1 border-round mb-1 flex flex-row align-items-center">
+      <div class="flex-1 flex-grow pl-3 py-1">
+        {{ operation.cause }}
+      </div>
+      <div class="w-15rem text-right pl-3 font-semibold mr-3">
+        {{ operation.updatedAt ?? operation.createdAt }}
+      </div>
+      <div class="w-10rem text-right pl-3 font-semibold mr-3"
+           :class="operation.change > 0 ? 'text-green-500' : 'text-red-500'">
+        {{ operation.change > 0 ? '+' : '-' }} {{ Math.abs(operation.change) }}
+      </div>
+      <div class="w-10rem text-right pl-3 font-semibold mr-3">
+        {{ operation.amountAfter }}
+      </div>
+    </div>
+
+  </div>
+</template>
+
+<script setup>
+
+  import InputText from "primevue/inputtext"
+
+  import {
+    defineProps, defineEmits, defineModel, toRefs, computed, watch, ref, watchEffect, onUnmounted,
+    getCurrentInstance, unref,
+  } from 'vue'
+
+  const props = defineProps({
+    name: {
+      type: String,
+      required: true
+    }
+  })
+  const { name } = toRefs(props)
+
+  import { usePath, live, useClient, useActions, reverseRange, useTimeSynchronization } from '@live-change/vue3-ssr'
+  const path = usePath()
+  const actions = useActions()
+
+  const balancePath = computed(() => path.balance.ownerOwnedBalance({
+    ownerType: 'balanceTest_balance',
+    owner: name.value
+  }))
+  const startedOperationsPath = computed(() => path.balance.operationsByBalance({
+    balance: `"balanceTest_balance":${JSON.stringify(name.value)}`,
+    state: 'started',
+    reverse: true,
+  }))
+  const finishedOperationsPath = computed(() => path.balance.operationsByBalance({
+    balance: `"balanceTest_balance":${JSON.stringify(name.value)}`,
+    state: 'finished',
+    reverse: true,
+  }))
+
+  const [balance, startedOperations, finishedOperations] = await Promise.all([
+    live(balancePath),
+    live(startedOperationsPath),
+    live(finishedOperationsPath)
+  ])
+
+</script>
+
+<style scoped>
+
+</style>

package/front/src/Index.vue

@@ -1,13 +1,70 @@
 <template>
-  <div>
-    <h1>Hello world!</h1>
-    <p>{{ currentTime }}</p>
-    <Clock :time="currentTime" />
+  <div class="w-full">
+    <div class="surface-card shadow-1 border-round p-3 text-xl mb-1">
+      All balances:
+    </div>
+    <div v-for="balance in allBalances" class="surface-card shadow-1 border-round flex flex-row align-items-center mt-1">
+      <div class="flex-1 flex-grow pl-3">
+        {{ balance.owner }}
+      </div>
+      <div class="w-10rem">
+        Amount: {{ balance.amount }}
+      </div>
+      <div class="w-10rem">
+        Available: {{ balance.available }}
+      </div>
+      <div>
+        <router-link :to="{ name: 'balance', params: { name: balance.owner }}" class="no-underline">
+          <Button label="Open" icon="pi pi-star" />
+        </router-link>
+        <Button @click="() => deleteBalance(balance)" label="Delete" icon="pi pi-trash" severity="danger" />
+      </div>
+    </div>
+    <div v-if="allBalances.length === 0" class="surface-card shadow-1 border-round p-3 flex flex-row">
+      No balances found
+    </div>
+    <div class="surface-card shadow-1 border-round p-3 mt-3">
+      <div class="text-xl mb-2">Add balance</div>
+      <command-form service="balanceTest" action="createBalance" v-slot="{ data }" reset-on-done>
+        <div class="col-12 md:col-6 py-1">
+          <div class="p-field mb-3">
+            <label for="email" class="block text-900 font-medium mb-2">
+              Name
+            </label>
+            <InputText id="name" type="text" class="w-full"
+                       aria-describedby="email-help" :class="{ 'p-invalid': data.nameError }"
+                       v-model="data.name" />
+            <small id="email-help" class="p-error">{{ data.nameError }}</small>
+          </div>
+        </div>
+        <Button label="Add balance" icon="pi pi-plus" type="submit" />
+      </command-form>
+    </div>
   </div>
 </template>
 
 <script setup>
-  import { currentTime } from "@live-change/frontend-base";
+
+  import InputText from "primevue/inputtext"
+
+  import {
+    defineProps, defineEmits, defineModel, toRefs, computed, watch, ref, watchEffect, onUnmounted,
+    getCurrentInstance, unref
+  } from 'vue'
+
+  import { usePath, live, useClient, useActions, reverseRange, useTimeSynchronization } from '@live-change/vue3-ssr'
+  const path = usePath()
+  const actions = useActions()
+
+  const allBalancesPath = computed(() => path.balanceTest.allBalances({}))
+
+  const [allBalances] = await Promise.all([
+    live(allBalancesPath)
+  ])
+
+  async function deleteBalance(balance) {
+    await actions.balanceTest.deleteBalance({ name: balance.owner })
+  }
 
 </script>
 

package/front/src/components/OperationsList.vue

@@ -0,0 +1,15 @@
+<script lang="ts">
+  import { defineComponent } from 'vue'
+
+  export default defineComponent({
+    name: 'OperationsList'
+  })
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>

package/front/src/pages/index.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="w-full">
+    dupa
+  </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped>
+
+</style>

package/front/src/router.js

@@ -12,24 +12,15 @@ import { dbAdminRoutes } from "@live-change/db-admin"
 import { userRoutes } from "@live-change/user-frontend"
 import { catchAllPagesRoute, contentEditRoutes, pagesSitemap } from "@live-change/content-frontend"
 
-import pagesRoutes from '~pages'
 
-export function routes(config = {}) {
+export function balanceRoutes(config = {}) {
   const { prefix = '/', route = (r) => r } = config
   return [
     ...userRoutes({ ...config, prefix: prefix + 'user/' }),
 
-    route({
-      name: 'index', path: prefix, meta: { },
-      component: () => import("./Index.vue")
-    }),
 
-    ...pagesRoutes,
 
-    ...contentEditRoutes({ ...config }),
 
-    ...dbAdminRoutes({ prefix: '/_db', route: r => ({ ...r, meta: { ...r.meta, raw: true }}) }),
-    ...catchAllPagesRoute({ ...config }),
   ]
 }
 
@@ -49,7 +40,21 @@ export function createRouter(app, config) {
     // use appropriate history implementation for server/client
     // import.meta.env.SSR is injected by Vite.
     history: import.meta.env.SSR ? createMemoryHistory() : createWebHistory(),
-    routes: routes(config)
+    routes: [
+      ...balanceRoutes(config),
+
+      {
+        name: 'index', path: '/', meta: { },
+        component: () => import("./Index.vue")
+      },
+      {
+        name: 'balance', path: '/balance/:name', meta: { }, props: true,
+        component: () => import("./Balance.vue")
+      },
+
+      ...dbAdminRoutes({ prefix: '/_db', route: r => ({ ...r, meta: { ...r.meta, raw: true }}) }),
+      ...catchAllPagesRoute({ ...config }),
+    ]
   })
   installRouterAnalytics(router)
   router.beforeEach(async (to, from) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@live-change/balance-frontend",
-  "version": "0.8.62",
+  "version": "0.8.63",
   "scripts": {
     "memDev": "node server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
     "localDevInit": "rm tmp.db; node server/start.js localDev --enableSessions --initScript ./init.js",
@@ -35,41 +35,41 @@
     "@codemirror/language": "6.10.1",
     "@dotenvx/dotenvx": "0.27.0",
     "@fortawesome/fontawesome-free": "^6.5.2",
-    "@live-change/access-control-frontend": "^0.8.62",
-    "@live-change/access-control-service": "^0.8.62",
-    "@live-change/backup-service": "^0.8.62",
-    "@live-change/blog-frontend": "^0.8.62",
-    "@live-change/blog-service": "^0.8.62",
-    "@live-change/cli": "^0.8.62",
-    "@live-change/content-frontend": "^0.8.62",
-    "@live-change/content-service": "^0.8.62",
-    "@live-change/dao": "^0.8.62",
-    "@live-change/dao-vue3": "^0.8.62",
-    "@live-change/dao-websocket": "^0.8.62",
-    "@live-change/db-client": "^0.8.62",
-    "@live-change/email-service": "^0.8.62",
-    "@live-change/framework": "^0.8.62",
-    "@live-change/frontend-auto-form": "^0.8.62",
-    "@live-change/frontend-base": "^0.8.62",
-    "@live-change/geoip-service": "^0.8.62",
-    "@live-change/image-frontend": "^0.8.62",
-    "@live-change/locale-settings-service": "^0.8.62",
-    "@live-change/password-authentication-service": "^0.8.62",
-    "@live-change/prosemirror-service": "^0.8.62",
-    "@live-change/secret-code-service": "^0.8.62",
-    "@live-change/secret-link-service": "^0.8.62",
-    "@live-change/session-service": "^0.8.62",
-    "@live-change/task-service": "^0.8.62",
-    "@live-change/upload-frontend": "^0.8.62",
-    "@live-change/url-frontend": "^0.8.62",
-    "@live-change/url-service": "^0.8.62",
-    "@live-change/user-frontend": "^0.8.62",
-    "@live-change/user-identification-service": "^0.8.62",
-    "@live-change/user-service": "^0.8.62",
-    "@live-change/vote-service": "^0.8.62",
-    "@live-change/vue3-components": "^0.8.62",
-    "@live-change/vue3-ssr": "^0.8.62",
-    "@live-change/wysiwyg-frontend": "^0.8.62",
+    "@live-change/access-control-frontend": "^0.8.63",
+    "@live-change/access-control-service": "^0.8.63",
+    "@live-change/backup-service": "^0.8.63",
+    "@live-change/blog-frontend": "^0.8.63",
+    "@live-change/blog-service": "^0.8.63",
+    "@live-change/cli": "^0.8.63",
+    "@live-change/content-frontend": "^0.8.63",
+    "@live-change/content-service": "^0.8.63",
+    "@live-change/dao": "^0.8.63",
+    "@live-change/dao-vue3": "^0.8.63",
+    "@live-change/dao-websocket": "^0.8.63",
+    "@live-change/db-client": "^0.8.63",
+    "@live-change/email-service": "^0.8.63",
+    "@live-change/framework": "^0.8.63",
+    "@live-change/frontend-auto-form": "^0.8.63",
+    "@live-change/frontend-base": "^0.8.63",
+    "@live-change/geoip-service": "^0.8.63",
+    "@live-change/image-frontend": "^0.8.63",
+    "@live-change/locale-settings-service": "^0.8.63",
+    "@live-change/password-authentication-service": "^0.8.63",
+    "@live-change/prosemirror-service": "^0.8.63",
+    "@live-change/secret-code-service": "^0.8.63",
+    "@live-change/secret-link-service": "^0.8.63",
+    "@live-change/session-service": "^0.8.63",
+    "@live-change/task-service": "^0.8.63",
+    "@live-change/upload-frontend": "^0.8.63",
+    "@live-change/url-frontend": "^0.8.63",
+    "@live-change/url-service": "^0.8.63",
+    "@live-change/user-frontend": "^0.8.63",
+    "@live-change/user-identification-service": "^0.8.63",
+    "@live-change/user-service": "^0.8.63",
+    "@live-change/vote-service": "^0.8.63",
+    "@live-change/vue3-components": "^0.8.63",
+    "@live-change/vue3-ssr": "^0.8.63",
+    "@live-change/wysiwyg-frontend": "^0.8.63",
     "@vueuse/core": "^10.11.0",
     "codeceptjs-assert": "^0.0.5",
     "compression": "^1.7.4",
@@ -91,7 +91,7 @@
     "vue3-scroll-border": "0.1.6"
   },
   "devDependencies": {
-    "@live-change/codeceptjs-helper": "^0.8.62",
+    "@live-change/codeceptjs-helper": "^0.8.63",
     "codeceptjs": "^3.6.5",
     "generate-password": "1.7.1",
     "playwright": "^1.41.2",
@@ -102,5 +102,5 @@
   "author": "Michał Łaszczewski <michal@laszczewski.pl>",
   "license": "ISC",
   "description": "",
-  "gitHead": "063d94e3e0a751ada8568b5b1913744c8879ea0e"
+  "gitHead": "f49f580138d6c44d9e9820197765ef982c5bab03"
 }

package/server/app.config.js

@@ -96,6 +96,9 @@ app.config = {
     {
       name: 'balance',
     },
+    {
+      name: 'balanceTest'
+    },
     {
       name: 'backup',
       port: 8007

package/server/balanceTest/balanceTest.js

@@ -0,0 +1,172 @@
+import App from '@live-change/framework'
+const app = App.app()
+
+import definition from './definition.js'
+
+const Balance = definition.foreignModel('balance', 'Balance')
+const Operation = definition.foreignModel('balance', 'Operation')
+
+definition.action({
+  name: 'createBalance',
+  properties: {
+    name: {
+      type: String,
+      validation: ["nonEmpty"]
+    }
+  },
+  returns: {
+    type: Balance
+  },
+  async execute({ name }, { service, client, triggerService }, emit) {
+    await triggerService({
+      service: 'accessControl',
+      type: 'accessControl_setOrUpdateObjectOwnedPublicAccess'
+    }, {
+      objectType: 'balanceTest_balance',
+      object: name,
+      sessionRoles: ['owner'],
+    })
+    return await triggerService({
+      service: 'balance',
+      type: 'balance_setOwnerOwnedBalance'
+    }, {
+      ownerType: 'balanceTest_balance',
+      owner: name
+    })
+  }
+})
+
+definition.action({
+  name: 'deleteBalance',
+  properties: {
+    name: {
+      type: String,
+      validation: ["nonEmpty"]
+    }
+  },
+  async execute({ name }, { service, client, triggerService }, emit) {
+    return await triggerService({
+      service: 'balance',
+      type: 'balance_resetOwnerOwnedBalance'
+    }, {
+      ownerType: 'balanceTest_balance',
+      owner: name
+    })
+  }
+})
+
+definition.view({
+  name: 'allBalances',
+  properties: {
+    ...App.rangeProperties
+  },
+  returns: {
+    type: Array,
+    of: {
+      type: Balance
+    }
+  },
+  async daoPath(range, { client, service }, method) {
+    return await Balance.rangePath(range)
+  }
+})
+
+definition.action({
+  name: 'startOperation',
+  properties: {
+    balance: {
+      type: Balance,
+      validation: ['nonEmpty']
+    },
+    change: {
+      type: Number,
+      validation: ['nonEmpty', 'integer']
+    },
+    name: {
+      type: String,
+      validation: ['nonEmpty']
+    }
+  },
+  async execute({ balance, change, name }, { client, service, triggerService }, emit) {
+    return await triggerService({
+      service: 'balance',
+      type: 'balance_startOperation'
+    }, {
+      balance, change,
+      causeType: 'balanceTest_operation',
+      cause: name
+    })
+  }
+})
+
+definition.action({
+  name: 'finishOperation',
+  properties: {
+    balance: {
+      type: Balance,
+      validation: ['nonEmpty']
+    },
+    operation: {
+      type: Operation,
+      validation: ['nonEmpty']
+    }
+  },
+  async execute({ balance, operation }, { client, service, triggerService }, emit) {
+    return await triggerService({
+      service: 'balance',
+      type: 'balance_finishOperation'
+    }, {
+      balance, operation
+    })
+  }
+})
+
+definition.action({
+  name: 'cancelOperation',
+  properties: {
+    balance: {
+      type: Balance,
+      validation: ['nonEmpty']
+    },
+    operation: {
+      type: Operation,
+      validation: ['nonEmpty']
+    }
+  },
+  async execute({ balance, operation }, { client, service, triggerService }, emit) {
+    return await triggerService({
+      service: 'balance',
+      type: 'balance_cancelOperation'
+    }, {
+      balance, operation
+    })
+  }
+})
+
+definition.action({
+  name: 'doOperation',
+  properties: {
+    balance: {
+      type: Balance,
+      validation: ['nonEmpty']
+    },
+    change: {
+      type: Number,
+      validation: ['nonEmpty', 'integer']
+    },
+    name: {
+      type: String,
+      validation: ['nonEmpty']
+    }
+  },
+  async execute({ balance, change, name }, { client, service, triggerService }, emit) {
+    return await triggerService({
+      service: 'balance',
+      type: 'balance_doOperation'
+    }, {
+      balance, change,
+      causeType: 'balanceTest_operation',
+      cause: name
+    })
+  }
+})

package/server/balanceTest/definition.js

@@ -0,0 +1,12 @@
+import App from '@live-change/framework'
+const app = App.app()
+
+import relationsPlugin from '@live-change/relations-plugin'
+import accessControlService from '@live-change/access-control-service'
+
+const definition = app.createServiceDefinition({
+  name: "balanceTest",
+  use: [ relationsPlugin, accessControlService ]
+})
+
+export default definition

package/server/balanceTest/index.js

@@ -0,0 +1,8 @@
+import App from '@live-change/framework'
+const app = App.app()
+
+import definition from './definition.js'
+
+import './balanceTest.js'
+
+export default definition

package/server/services.list.js

@@ -51,3 +51,9 @@ export {
   balance,
   init
 }
+
+import balanceTest from './balanceTest/index.js'
+
+export {
+  balanceTest
+}

package/front/src/components/Clock.vue

@@ -1,22 +0,0 @@
-
-<template>
-  <div class="surface-card p-3 shadow-2 border-round">
-    {{ d(new Date(), 'long') }}
-  </div>
-</template>
-
-<script setup lang="ts">
-  import { defineProps, toRefs } from 'vue'
-  import { useI18n } from 'vue-i18n'
-  const { t, d, n } = useI18n()
-
-  const props = defineProps<{
-    time: number
-  }>()
-
-  const { time } = toRefs(props)
-</script>
-
-<style scoped>
-
-</style>