waibu-mpa 1.0.13 → 1.0.15

package/bajo/method/build-url.js

@@ -1,4 +1,4 @@
-function buildUrl ({ exclude = [], prefix = '?', base, url = '', params = {} }) {
+function buildUrl ({ exclude = [], prefix = '?', base, url = '', params = {}, prettyUrl }) {
   const { qs } = this.app.waibu
   const { forOwn, omit, isEmpty } = this.app.bajo.lib._
   const qsKey = this.app.waibu.config.qsKey
@@ -13,6 +13,8 @@ function buildUrl ({ exclude = [], prefix = '?', base, url = '', params = {} })
     const key = qsKey[k] ?? k
     query[key] = v
   })
+  const id = query.id
+  if (prettyUrl) delete query.id
   query = prefix + qs.stringify(omit(query, exclude))
   if (!isEmpty(hash)) hash = '#' + hash
   if (!base) return path + query + hash
@@ -21,6 +23,7 @@ function buildUrl ({ exclude = [], prefix = '?', base, url = '', params = {} })
     parts.pop()
     parts.push(base)
   }
+  if (prettyUrl && id) parts.push(id)
   return parts.join('/') + query + hash
 }
 

package/bajoI18N/resource/en-US.json

@@ -1,4 +1,6 @@
 {
+  "404Message": "Page not found, sorry!",
+  "500Message": "Internal server error, sorry!",
   "field": {
     "session": "Session",
     "expires": "Expires"

package/bajoI18N/resource/id.json

@@ -22,6 +22,8 @@
   "Success": "Sukses",
   "Warning": "Peringatan",
   "Danger": "Bahaya",
+  "404Message": "Maaf, halaman yang Anda inginkan tidak ditemukan. Silahkan kontak Admin Anda segera!",
+  "500Message": "Maaf, ada kesalahan internal server. Silahkan kontak Admin Anda segera!",
   "field": {
     "session": "Sesi",
     "expires": "Kadaluarsa"

package/lib/build-locals.js

@@ -15,6 +15,7 @@ async function buildLocals ({ template, params = {}, opts = {} } = {}) {
   const { getAppTitle } = this.app.waibuMpa
   const { set, merge, pick, get, isEmpty, find } = this.app.bajo.lib._
   const { req, reply } = opts
+
   params.page = merge(params.page ?? {}, { ns: req.ns, appTitle: getAppTitle(req.ns) })
   set(params, 'menu.homes', buildHomesMenu.call(this))
 
@@ -24,9 +25,14 @@ async function buildLocals ({ template, params = {}, opts = {} } = {}) {
   const routeOpts = get(req, 'routeOptions.config', {})
   const _meta = { theme, iconset, site, user, lang, darkMode, routeOpts }
   merge(_meta, pick(req, ['url', 'params', 'query']))
+  _meta.env = this.app.bajo.config.env
   _meta.url = _meta.url.split('?')[0].split('#')[0]
   _meta.route = get(req, 'routeOptions.url')
   _meta.template = template
+  if (params.error) {
+    _meta.statusCode = params.error.statusCode ?? 200
+    _meta.errorMessage = params.error.message
+  }
   if (req.flash && !opts.partial) _meta.flash = reply.flash()
   const merged = merge({}, params, { _meta })
   await runHook(`${this.name}:afterBuildLocals`, merged, req)

package/lib/class/component.js

@@ -154,10 +154,10 @@ class Component {
     return items.join('\n')
   }
 
-  buildUrl ({ exclude, prefix, base, url, params = {} }) {
+  buildUrl ({ exclude, prefix, base, url, params = {}, prettyUrl }) {
     const { buildUrl } = this.plugin.app.waibuMpa
     url = url ?? this.req.referer ?? this.req.url
-    return buildUrl({ exclude, prefix, base, url, params })
+    return buildUrl({ exclude, prefix, base, url, params, prettyUrl })
   }
 
   async buildSentence (sentence, params = {}, extra = {}) {

package/lib/class/factory/page-end.js

@@ -20,9 +20,8 @@ class PageEnd extends Factory {
     let tc = ''
     if (!this.params.attr.noToastContainer && factory.toastStack && factory.toast) {
       const toasts = []
-      const err = get(locals, 'error')
-      if (err) {
-        const details = get(err, 'details', [])
+      if (get(locals, 'error')) {
+        const details = get(locals.error, 'details', [])
         if (details.length > 0) {
           const list = [`<ul class="m-0 ${details.length === 1 ? 'list-unstyled' : ''}">`]
           for (const d of details) {
@@ -34,12 +33,12 @@ class PageEnd extends Factory {
           const attr = {
             border: 'side:all width:0',
             text: 'background:danger',
-            title: req.t(err.message)
+            title: req.t(locals.error.message)
           }
           toasts.push(await this.component.buildTag({ tag: 'toast', attr, html: list.join('\n') }))
-        } else {
+        } else if (!(locals._meta.statusCode === 404 || locals._meta.statusCode >= 500)) {
           const attr = { border: 'side:all width:0', text: 'background:danger' }
-          toasts.push(await this.component.buildTag({ tag: 'toast', attr, html: this.component.req.t(err.message) }))
+          toasts.push(await this.component.buildTag({ tag: 'toast', attr, html: this.component.req.t(locals.error.message) }))
         }
       }
       const notifications = get(locals, '_meta.flash.notify', [])

package/lib/class/view-engine.js

@@ -9,6 +9,7 @@ class ViewEngine {
     this.fileExts = typeof fileExts === 'string' ? [fileExts] : fileExts
     this.cacheMaxAge = plugin.app.waibuMpa.config.viewEngine.cacheMaxAge
     this.md = get(plugin, 'app.bajoMarkdown')
+    this.history = {}
   }
 
   _applySetting (opts = {}) {
@@ -20,9 +21,23 @@ class ViewEngine {
     opts.theme = get(setting, 'theme', req.theme)
   }
 
+  _clearHistory () {
+    const { omit } = this.plugin.app.bajo.lib._
+    const maxAge = 60
+    const now = Date.now()
+    const omitted = []
+    for (const reqId in this.history) {
+      const history = this.history[reqId]
+      if ((history.ts + (maxAge * 1000)) < now) omitted.push(reqId)
+    }
+    this.history = omit(this.history, omitted)
+  }
+
   async render (tpl, locals = {}, opts = {}) {
-    const { trim, isEmpty } = this.plugin.app.bajo.lib._
+    this._clearHistory()
+    const { trim, isEmpty, last } = this.plugin.app.bajo.lib._
     const { fs } = this.plugin.app.bajo.lib
+    const { req } = opts
     const mpa = this.plugin.app.waibuMpa
     const { ns, subSubNs, path, qs } = mpa.getResource(tpl)
     this._applySetting(opts)
@@ -34,12 +49,23 @@ class ViewEngine {
       resp = mpa.resolvePartial(`${ns}.partial${subSubNs ? ('.' + subSubNs) : ''}:${path}`, opts)
     }
     const file = resp.file
+    // prevent looping
+    if (this.history[req.id]) {
+      if (last(this.history[req.id].file) === file) throw this.plugin.error('Template looping detected: %s => %s', tpl, file)
+      this.history[req.id].file.push(file)
+    } else {
+      this.history[req.id] = {
+        ts: Date.now(),
+        file: [file]
+      }
+    }
     let content = trim(fs.readFileSync(file, 'utf8'))
     if (isEmpty(content) && tpl.includes('.template')) {
       content = '<c:include resource="' + tpl.replace('.template', '.partial') + '" />'
     }
     opts.ext = _path.extname(file)
     opts.fn = true
+    opts.tpl = tpl
     return await this.write(content, locals, opts)
   }
 
@@ -66,7 +92,7 @@ class ViewEngine {
     let layout
     if (!opts.partial) {
       locals.page = merge(locals.page, parseObject(parsed.frontMatter, { parseValue: true, i18n: req.i18n, ns: reqNs }))
-      layout = locals.page.layout ?? qs.layout ?? opts.layout ?? `${reqNs}.layout:/default.html`
+      layout = locals.page.layout ?? qs.layout ?? opts.layout ?? (locals.page.ns ? `${locals.page.ns}.layout:/default.html` : 'main.layout:/default.html')
       const ext = _path.extname(layout)
       const { file } = mpa.resolveLayout(layout, opts)
       let layoutContent = fs.readFileSync(file, 'utf8')
@@ -89,7 +115,7 @@ class ViewEngine {
       locals.page.fullTitle = locals.fullTitle ?? (locals.page.title ? `${locals.page.title} - ${req.t(locals.page.appTitle)}` : req.t(locals.page.appTitle))
     }
     // if (['.js'].includes(opts.ext)) return content // TODO: clash with lodash template
-    return await getCachedResult.call(this.plugin, content, locals, { req, ttl: this.cacheMaxAge, fn: opts.fn })
+    return await getCachedResult.call(this.plugin, content, locals, { req, ttl: this.cacheMaxAge, fn: opts.fn, tpl: opts.tpl })
   }
 }
 

package/lib/error.js

@@ -4,6 +4,7 @@ const extHandler = async function (err, req, reply) {
   const { getPluginFile } = this.app.bajo
   const { fs } = this.app.bajo.lib
   const { template } = this.app.bajo.lib._
+  err.statusCode = err.statusCode ?? 500
 
   if (err.message.toLowerCase() === 'notfound' || err.statusCode === 404) {
     return await handler.call(this, req, reply)
@@ -12,6 +13,7 @@ const extHandler = async function (err, req, reply) {
   try {
     result = await reply.view('waibuMpa.template:/500.html', { error: err })
   } catch (err) {
+    console.log(err)
     const file = getPluginFile(`${this.name}:/waibuMpa/template/_500.html`)
     const content = fs.readFileSync(file)
     const compiled = template(content)

package/lib/get-cached-result.js

@@ -1,6 +1,6 @@
 import crypto from 'crypto'
 
-async function getCachedResult (content, params, { req, ttl = 0, fn = false, keyFn } = {}) {
+async function getCachedResult (content, params, { req, ttl = 0, fn = false, keyFn, tpl } = {}) {
   const _ = this.app.bajo.lib._
   const { template, get } = _
   const cache = this.app.bajoCache

package/lib/not-found.js

@@ -30,9 +30,10 @@ export async function handler (req, reply) {
     if (fn) redirectTo = await fn(req)
     if (redirectTo) return reply.redirectTo(redirectTo)
   }
-  const message = this.print.write('Route \'%s (%s)\' not found', req.url, req.method)
+  const error = this.error('Route \'%s (%s)\' not found', req.url, req.method)
+  error.statusCode = 404
   reply.code(404)
-  if (reply.view) return await reply.view('waibuMpa.template:/404.html', { message })
+  if (reply.view) return await reply.view('waibuMpa.template:/404.html', { error })
 }
 
 async function notFound (ctx) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "waibu-mpa",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "MPA support for Waibu Framework",
   "main": "index.js",
   "scripts": {

package/waibuMpa/partial/404.html

@@ -0,0 +1,6 @@
+<c:container margin="y-4">
+  <c:div text="align:center">
+    <c:heading type="6-display" t:content="Not Found" />
+    <c:p t:content="404Message" />
+  </c:div>
+</c:container>

package/waibuMpa/partial/500.html

@@ -0,0 +1,10 @@
+<c:container margin="y-4">
+  <c:div text="align:center">
+    <c:heading type="6-display" t:content="Internal Server Error" />
+    <% if (_meta.env === 'dev') { %>
+    <%= _meta.errorMessage %>
+    <% } else { %>
+    <c:t>500Message</c:t>
+    <% } %>
+  </c:div>
+</c:container>

package/waibuMpa/partial/address.html

@@ -0,0 +1,8 @@
+<% const type = attr.type ?? 'site' %>
+<address>
+  <c:strong text="nowrap"><%= type === 'user' ? (_meta[type].firstName + ' ' + _meta[type].lastName) : _meta[type].orgName %></c:strong><br />
+  <%= _meta[type].address1 %><br/>
+  <%= _meta[type].address2 %><br />
+  <c:span text="nowrap"><%= _meta[type].city %> <%= _meta[type].zipCode %> - <%= _meta[type].provinceState %></c:span><br />
+  <%= _meta[type].country %><br />
+</address>

package/waibuMpa/template/404.html

@@ -1 +0,0 @@
-404

package/waibuMpa/template/500.html

@@ -1,4 +0,0 @@
----
-t:title: Error
----
-500

package/waibuMpa/template/wmpa.js

@@ -407,9 +407,30 @@ class Wmpa {
       return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
     }).join(''))
   }
+
+  getTableDataset (selector, ignoreHeader = true) {
+    const table = document.querySelector(selector)
+    if (!table) return []
+    const data = []
+    let row
+    for (let i = ignoreHeader ? 1 : 0; row = table.rows[i]; i++) {
+      let col
+      const d = {}
+      for (let j = 0; col = row.cells[j]; j++) {
+        if (!col.dataset.key) continue
+        let value = col.dataset.value
+        if (['integer', 'float'].includes(col.dataset.type)) value = Number(value)
+        else if (col.dataset.type === 'boolean') value = value === 'true'
+        d[col.dataset.key] = value
+      }
+      data.push(d)
+    }
+    return data
+  }
 }
 
 const wmpa = new Wmpa() // eslint-disable-line no-unused-vars
+window.wmpa = wmpa
 if (window._ && window._.VERSION) {
   window._.templateSettings.evaluate = /\{\%(.+?)\%\}/g
   window._.templateSettings.interpolate = /\{\%=(.+?)\%\}/g