@things-factory/shell 7.0.1-alpha.4 → 7.0.1-alpha.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@things-factory/shell",
-  "version": "7.0.1-alpha.4",
+  "version": "7.0.1-alpha.9",
   "description": "Core module for framework",
   "bin": {
     "things-factory": "bin/things-factory",
@@ -118,7 +118,6 @@
     "reselect": "^4.0.0",
     "sass": "^1.50.1",
     "scrollbooster": "^3.0.2",
-    "sweetalert2": "^11.7.3",
     "type-graphql": "^2.0.0-beta.6",
     "typeorm": "^0.3.19",
     "uuid": "^3.4.0",
@@ -134,5 +133,5 @@
     "pg": "^8.7.3",
     "sqlite3": "^5.0.8"
   },
-  "gitHead": "41b951d71135f4e9ae936a85a3cd7a374c5664cc"
+  "gitHead": "e77082517f5483704f1e884cbc81b7f94c0eec15"
 }

package/client/elements/custom-alert.js

@@ -1,120 +0,0 @@
-import Swal from 'sweetalert2'
-
-/**
- * Custom Alert utilized sweetalert2 to produce a simple pop-up message box.
- * *Side note: Did not fully utilize sweet alert capability, just added some common usage.
- * @param {string} type - ['success', 'error', 'warning', 'info', 'question']
- * @param {string} icon - ['success', 'error', 'warning', 'info', 'question']
- * @param {string} title - Title for the message box.
- * @param {string} text - Description for the message box. Input can be in html format.
- * @param {string} footer - Footer message. Input can be in html format
- * @param {string} [position = 'center'] - Position of the message box. ['top', 'top-start', 'top-end', 'center', 'center-start', 'center-end', 'bottom', 'bottom-start', 'bottom-end']
- * @param {boolean} toast - Set to 'True' to display as toast.
- * @param {object} confirmButton - Confirm button is an object type. The text and color of the button can be changed by adding 'text' or 'color' property into the object.
- *                                 text is the required field of the object. When the object is populated, the confirm button will automatically shown.
- * @param {object} cancelButton - Cancel button is an object type. The text and color of the button can be changed by adding 'text' or 'color' property into the object.
- *                                text is the required field of the object. When the object is populated, the cancel button will automatically shown.
- * @param {boolean} [invertButton = false] - Invert button to swap the position of the buttons.
- *                                           eg. Confirm button on the right, Cancel button on the left.
- * @param {function} callback - Accepts a function with an input parameter. Will invoked after swal.fire. It is a promise chaining function.
- * @param {function} onBeforeOpen - Accepts a function with no parameter. Function to run when modal built, but not shown yet. Provides modal DOM element as the first argument.
- * @param {function} onOpen - Accepts a function with no parameter. Function to run when modal opens, provides modal DOM element as the first argument.
- * @param {function} onRender - Accepts a function with no parameter. Function to run after modal DOM has been updated. eg. After Swal.fire() or Swal.update()
- * @param {function} onClose - Accepts a function with no parameter. Function to run when modal closes, provides modal DOM element as the first argument.
- * @param {function} onAfterClose - Accepts a function with no parameter. Function to run after modal has been disposed.
- * @param {boolean} [debug = false] - Check all parameters are set properly. When set to 'true', simple checking will be done on the input parameters to verify the type.
- */
-
-export async function CustomAlert({
-  type = 'info',
-  icon,
-  title,
-  text,
-  allowOutsideClick = true,
-  allowEscapeKey = true,
-  footer,
-  position = 'center',
-  toast,
-  timer,
-  confirmButton = {},
-  cancelButton = {},
-  invertButton = false,
-  callback,
-  onBeforeOpen,
-  onOpen,
-  onRender,
-  onClose,
-  onAfterClose,
-  debug = false
-}) {
-  try {
-    if (debug) {
-      let arrTypes = ['success', 'error', 'warning', 'info', 'question']
-      let err = ''
-      if (!arrTypes.includes(type)) {
-        err = err + 'Invalid Alert Type.\n'
-      }
-
-      if (title && typeof title !== 'string') err = err + 'Invalid Title.\n'
-      if (text && typeof text !== 'string') err = err + 'Invalid Text.\n'
-      if (footer && typeof text !== 'string') err = err + 'Invalid Footer.\n'
-      if (typeof position !== 'string') err = err + 'Invalid Position.\n'
-      if (toast && typeof toast !== 'boolean') err = err + 'Invalid Footer.\n'
-      if (
-        Object.keys(confirmButton).length > 0 &&
-        (typeof confirmButton !== 'object' || !confirmButton.hasOwnProperty('text'))
-      )
-        err = err + 'Invalid Confirm Button.\n'
-      if (
-        Object.keys(cancelButton).length > 0 &&
-        (typeof cancelButton !== 'object' || !cancelButton.hasOwnProperty('text'))
-      )
-        err = err + 'Invalid Cancel Button.\n'
-
-      if (err !== '') throw new Error(err)
-    }
-
-    const result = await Swal.fire({
-      icon: icon || type,
-      title: title,
-      text: text,
-      timer: timer ? timer:0,
-      timerProgressBar: timer ? true : 0,
-      allowOutsideClick: allowOutsideClick,
-      allowEscapeKey: allowEscapeKey,
-      footer: footer,
-      position: position,
-      showConfirmButton: Object.keys(confirmButton).length > 0 ? true : false,
-      showCancelButton: Object.keys(cancelButton).length > 0 ? true : false,
-      confirmButtonText: confirmButton.hasOwnProperty('text') ? confirmButton.text : 'confirm',
-      cancelButtonText: cancelButton.hasOwnProperty('text') ? cancelButton.text : 'cancel',
-      confirmButtonColor: confirmButton.hasOwnProperty('color') ? confirmButton.color : '#22a6a7',
-      cancelButtonColor: cancelButton.hasOwnProperty('color') ? cancelButton.color : '#cfcfcf',
-      toast: toast,
-      reverseButtons: invertButton,
-      willOpen: () => {
-        onBeforeOpen ? onBeforeOpen() : undefined
-      },
-      didOpen: () => {
-        onOpen ? onOpen() : undefined
-      },
-      didRender: () => {
-        onRender ? onRender() : undefined
-      },
-      willClose: () => {
-        onClose ? onClose() : undefined
-      },
-      didClose: () => {
-        onAfterClose ? onAfterClose() : undefined
-      }
-    })
-
-    if (callback && typeof callback === 'function') {
-      callback(result)
-    } else {
-      return Promise.resolve(result)
-    }
-  } catch (error) {
-    console.log('%c(Custom-Alert)\n' + error, 'color:Red')
-  }
-}

package/helps/components/oops-progress.md

@@ -1,73 +0,0 @@
-# OOPS Progress 컴포넌트
-
-긴 시간 진행되는 작업의 진행 상황을 표현해주기 위해 서버에 진행율을 Subscribe하는 클라이언트 컴포넌트이다.
-이 컴포넌트는 자체적으로 시각적 요소를 포함하지 않지만, 시각적 표현을 위해서 자식 노드(Light DOM)를 포함할 수는 있다.
-
-## properties
-
-- tag: String 서브스크립션 태그이며, 서버의 'publishProgress'의 tag와 일치시키도록 한다.
-- subscription: String (readonly) 이 속성이 값을 가지고 있으면, 서브스크립션 중임을 의미한다.
-
-## methods
-
-- startSubscribe() 진행율 구독을 시작한다.
-- stopSubscribe() 진행율 구독을 종료한다.(서버쪽 작업의 종료를 의미하지 않으며, 클라이언트에서 구독을 종료한다는 의미임.)
-
-## event
-
-- progress(event) 서버로부터 진행율이 Subscribe 되었을 때 발생한다.
-  - event.detail : progress 값을 갖는다.
-- finish(event) 진행율이 100% 도달하면 발생한다.
-
-## 예시
-
-### 클라이언트 사이드
-
-```
-  <oops-progress
-    .tag='progress-pending-job'
-    @progress=${e => {
-      this.progress = e.detail
-    }}
-    @finish=${() => {
-      console.log('complete')
-    }}
-    ?hidden=${progress < 0 || progress > 100}
-  >
-    <div>
-      <mwc-linear-progress .progress=${progress / 100}></mwc-linear-progress>
-      <span>Progress : ${progress} % (${message})</span>
-    </div>
-  </oops-progress>
-
-```
-
-### 서버사이드
-
-```
-import { sleep } from '@things-factory/utils'
-
-...
-
-@Mutation(returns => String, { description: 'To reference of pending job progress' })
-async referencePendingJob(
-  @Root() _,
-  @Ctx() context: any
-) : Promise<string> {
-
-  const { domain } = context.state
-
-  for(var i = 0;i <= 100;i++) {
-    await sleep(100)
-
-    publishProgress({
-      domain,
-      tag: 'progress-pending-job',
-      progress: i,
-      message: `${i * 10} / 1000`
-    })
-  }
-
-  return 'success'
-}
-```