\r\n
\r\n}","export function isExternalLink(link){\r\n return link && (link.indexOf('https://') === 0 || link.indexOf('http://') === 0 || link.indexOf('://') === 0);\r\n}\r\n\r\nexport function getLinkFromElement(el){\r\n if (!el) return null;\r\n const linkEl = el.closest('a');\r\n //console.log(el, linkEl);\r\n if (linkEl){\r\n return linkEl.getAttribute('href');\r\n }\r\n return null;\r\n}\r\n\r\n\r\n// router utils\r\nexport function getLinkInfo(link) {\r\n if (!link) return null;\r\n\r\n const origin = typeof window !== `undefined` && window.location && window.location.origin;\r\n const currentPath = typeof window !== `undefined` && window.location && window.location.pathname;\r\n let linkFiltered = link.replace(origin, '').replace(currentPath + '#', '#');\r\n let linkLower = link.toLowerCase();\r\n\r\n //if (isStaticFile(linkLower)) return null;\r\n const isExternal = isExternalLink(linkFiltered);\r\n const isHash = linkFiltered.indexOf('#') === 0;\r\n const isTel = linkFiltered.indexOf('tel:') === 0;\r\n const isMailTo = linkFiltered.indexOf('mailto:') === 0;\r\n const type = (isHash && 'hash') || (isTel && 'tel') || (isMailTo && 'mailto') || \r\n (isStaticFile(linkLower) && 'static') || (isExternal && 'external') || 'internal';\r\n\r\n return { url: linkFiltered, type: type, ext: getExtension(link) };\r\n}\r\n\r\nvar exts = ['.pdf', '.jpg', '.png', '.gif', '.docx', '.doc']\r\nfunction isStaticFile(path) {\r\n for(let i = 0; i < exts.length; i++) {\r\n if (path.indexOf(exts[i]) >= 0) return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function getExtension(filename) {\r\n if (!filename || filename.indexOf('.') < 0) return null;\r\n return filename.split('.').pop().toLowerCase();\r\n}\r\n\r\nexport function getFilename(url) {\r\n return url.split('/').pop().split('?')[0];\r\n}\r\n\r\n//\r\nexport function toQueryString(params) {\r\n var queryString = Object.keys(params).map((key) => {\r\n return encodeURIComponent(key) + '=' + encodeURIComponent(params[key])\r\n }).join('&');\r\n return queryString;\r\n}\r\n\r\nexport function getYoutubeId(url){\r\n url = url.split(/(vi\\/|v=|\\/v\\/|youtu\\.be\\/|\\/embed\\/)/);\r\n return (url[2] !== undefined) ? url[2].split(/[^0-9a-z_-]/i)[0] : url[0];\r\n}\r\n\r\nexport function getSlug(text){\r\n return text.toLowerCase().replace(/ /g,'-').replace(/[-]+/g, '-').replace(/[^\\w-]+/g,'');\r\n}","//#region error json parsing\r\nexport const getErrors = (result) => {\r\n let errors = [];\r\n if (result && result.errors && result.errors.length > 0) {\r\n result.errors.forEach(err => {\r\n errors.push(err.errorMessage);\r\n });\r\n }\r\n return errors;\r\n}\r\n\r\nexport const getErrorMessage = (result) => {\r\n let errors = getErrors(result);\r\n return errors.join(\" \");\r\n}\r\n//#endregion","//#region conversion between array and object\r\nexport const convertToObject = (array, key) => {\r\n const initialValue = {};\r\n return array.reduce((obj, item) => {\r\n return {\r\n ...obj,\r\n [item[key]]: item,\r\n };\r\n }, initialValue);\r\n};\r\n\r\nexport const convertToKeyValues = (array, key, value) => {\r\n const initialValue = {};\r\n return array.reduce((obj, item) => {\r\n return {\r\n ...obj,\r\n [item[key]]: item[value],\r\n };\r\n }, initialValue);\r\n};\r\n//#endregion\r\n\r\n//#region array helper functions\r\nexport const moveItem = (list, fromIndex, toIndex) => {\r\n //const list = Array.from(array);\r\n const [removed] = list.splice(fromIndex, 1);\r\n list.splice(toIndex, 0, removed);\r\n\r\n return list;\r\n};\r\n\r\nexport const removeItem = (list, index) => {\r\n //const list = Array.from(array);\r\n list.splice(index, 1);\r\n\r\n return list;\r\n};\r\n\r\nexport const insertItem = (list, index, item) => {\r\n //const list = Array.from(array);\r\n list.splice(index, 0, item);\r\n\r\n return list;\r\n};\r\n\r\n\r\nexport const find = (list, fn) => {\r\n if (!list) return null;\r\n for (let i = 0; i < list.length; i++) {\r\n if (fn(list[i])) {\r\n return list[i];\r\n }\r\n }\r\n};\r\n\r\nexport const findIndex = (list, fn) => {\r\n if (!list) return -1;\r\n for (let i = 0; i < list.length; i++) {\r\n if (fn(list[i])) {\r\n return i;\r\n }\r\n }\r\n};\r\n\r\nexport const contains = (list, fn) => {\r\n return findIndex(list, fn) >= 0;\r\n}\r\n\r\nexport const sum = (list, fn) => {\r\n if (!list) return 0;\r\n let total = 0;\r\n for (let i = 0; i < list.length; i++) {\r\n total += fn(list[i]) || 0\r\n }\r\n return total\r\n}\r\n\r\nexport const equal = (list1, list2, fn) => {\r\n if (!list1 && !list2) return true;\r\n if (!list1 || !list2) return false;\r\n if (list1.length !== list2.length) return false;\r\n for (let i = 0; i < list1.length; i++) {\r\n let found = false;\r\n for (let j = 0; j < list2.length; j++) {\r\n if(fn(list1[i], list2[i])) {\r\n found = true;\r\n break;\r\n }\r\n }\r\n if (!found) return false;\r\n }\r\n return true;\r\n}\r\n//#endregion\r\n\r\n//#region sorting helpers\r\nexport const caseInsensitiveCompare = function (a, b) {\r\n return a.toLowerCase().localeCompare(b.toLowerCase());\r\n}\r\n\r\n// put the null items at the end.\r\nexport const compareIgnoreEmpty = function (asc) {\r\n return asc ?\r\n function (a, b) {\r\n return (a === null || isNaN(a)) - (b === null || isNaN(b)) || +(a > b) || -(a < b);\r\n }\r\n :\r\n function (a, b) {\r\n return (a === null || isNaN(a)) - (b === null || isNaN(b)) || -(a > b) || +(a < b);\r\n }\r\n}\r\n//#endregion","import parse from 'date-fns/parse';\r\nimport parseISO from 'date-fns/parseISO';\r\n\r\n//#region manipulation\r\nexport const addDays = (date, days) => {\r\n var result = new Date(date)\r\n result.setDate(result.getDate() + days)\r\n return result\r\n}\r\n//#endregion\r\n\r\n//#region format\r\nexport function formatYYYYMMDD(dateObj) {\r\n const date = toDate(dateObj);\r\n //console.log(dateObj, date)\r\n if (!date) return '';\r\n var dd = date.getDate();\r\n var mm = date.getMonth() + 1; //January is 0!\r\n\r\n var yyyy = date.getFullYear();\r\n if (dd < 10) {\r\n dd = '0' + dd;\r\n } \r\n if (mm < 10) {\r\n mm = '0' + mm;\r\n } \r\n return (`${yyyy}-${mm}-${dd}`)\r\n}\r\n\r\nexport function formatDDMMYYYY(dateObj) {\r\n const date = toDate(dateObj);\r\n //console.log(dateObj, date)\r\n if (!date) return '';\r\n var dd = date.getDate();\r\n var mm = date.getMonth() + 1; //January is 0!\r\n\r\n var yyyy = date.getFullYear();\r\n if (dd < 10) {\r\n dd = '0' + dd;\r\n } \r\n if (mm < 10) {\r\n mm = '0' + mm;\r\n }\r\n return (`${dd}-${mm}-${yyyy}`)\r\n}\r\n//#endregion\r\n\r\n//#region parse\r\nexport function toDate(dateObj){\r\n if (!dateObj) return null;\r\n if (typeof dateObj === 'string') {\r\n return parseDate(dateObj, 'yyyy-MM-dd') ||\r\n parseDate(dateObj, 'yyyy-M-d') ||\r\n parseDate(dateObj, 'dd/MM/yyyy') ||\r\n parseDate(dateObj, 'd/M/yyyy') ||\r\n parseISO(dateObj)\r\n } else {\r\n return dateObj;\r\n }\r\n}\r\n\r\nexport function toDateTime(dateObj){\r\n if (!dateObj) return null;\r\n if (typeof dateObj === 'string') {\r\n return parseDate(dateObj, \"yyyy-MM-dd'T'HH:mm:ss.SSSxxx\") ||\r\n parseDate(dateObj, 'yyyy-MM-dd HH:mm:ss.SSSxxx') ||\r\n parseDate(dateObj, 'yyyy-M-d HH:mm:ss.SSSxxx') ||\r\n parseDate(dateObj, 'dd/MM/yyyy HH:mm:ss.SSSxxx') ||\r\n parseDate(dateObj, 'd/M/yyyy HH:mm:ss.SSSxxx') ||\r\n parseISO(dateObj)\r\n } else {\r\n return dateObj;\r\n }\r\n}\r\n\r\nexport function parseDate(dateStr, format) {\r\n const date = parse(dateStr, format, new Date());\r\n return date && isValidDate(date)? date : null;\r\n}\r\n\r\nexport function isValidDate(d) {\r\n return d instanceof Date && !isNaN(d);\r\n}\r\n//#endregion","//#region background images\r\nexport const bgUrl = (imageUrl) => {\r\n return `background-image:url(\"` + encodeURI(decodeURI(imageUrl)) + `\")`\r\n}\r\n\r\nexport const bgUrlStyle = (imageUrl) => {\r\n return `url(\"` + encodeURI(decodeURI(imageUrl)) + `\")`\r\n}\r\n//#endregion\r\n\r\n//#region screen/element size\r\nexport const screenWidth = () => {\r\n if (typeof window !== `undefined`) { \r\n return window.innerWidth ||\r\n document.documentElement.clientWidth ||\r\n document.body.clientWidth\r\n } else {\r\n return 0;\r\n }\r\n}\r\n\r\nexport const screenHeight = () => {\r\n if (typeof window !== `undefined`) { \r\n return window.innerHeight ||\r\n document.documentElement.clientHeight ||\r\n document.body.clientHeight\r\n } else {\r\n return 0;\r\n }\r\n}\r\n\r\nexport const outerWidth = el => el.offsetWidth\r\nexport const outerHeight = el => el.offsetHeight\r\n//#endregion\r\n\r\n//#region css class\r\n/**\r\n * Check if element has the css class on it.\r\n */\r\nexport const hasClass = (el, className) => {\r\n if (el.classList) {\r\n return el.classList.contains(className)\r\n }\r\n\r\n return !!el.className.match(new RegExp(`(\\\\s|^)${className}(\\\\s|$)`))\r\n}\r\n\r\n/**\r\n * Adds the provided css className to the element.\r\n */\r\nexport const addClass = (el, className) => {\r\n if (el.classList) {\r\n el.classList.add(className)\r\n return\r\n }\r\n\r\n if (!hasClass(el, className)) {\r\n el.className += ` ${className}`\r\n }\r\n}\r\n\r\n/**\r\n * Remove the provided css className from the element.\r\n */\r\nexport const removeClass = (el, className) => {\r\n if (el.classList) {\r\n el.classList.remove(className)\r\n return\r\n }\r\n\r\n if (hasClass(el, className)) {\r\n const reg = new RegExp(`(\\\\s|^)${className}(\\\\s|$)`)\r\n el.className = el.className.replace(reg, ' ')\r\n }\r\n}\r\n\r\n/**\r\n * Adds or removes a class name on the input depending on the status flag.\r\n */\r\nexport const toggleClass = (el, className, status) => {\r\n if (!el || !className) return\r\n\r\n if (status) {\r\n return addClass(el, className)\r\n }\r\n\r\n removeClass(el, className)\r\n}\r\n//#endregion","import { gsap } from 'gsap';\r\nimport { ScrollToPlugin } from 'gsap/ScrollToPlugin';\r\n\r\ngsap.registerPlugin(ScrollToPlugin);\r\n\r\nexport function scrollTo(selector, duration = 750, delay = 0) {\r\n const el = findElement(selector);\r\n if (el) {\r\n setTimeout(() => {\r\n //console.log(element);\r\n const offset = elementOffset(el);\r\n //console.log(offset)\r\n //window.scrollTo(0, offset.top - 300);\r\n\r\n gsap.to(window, {duration: (duration/1000), scrollTo: offset.top - 100, ease: 'power1'});\r\n\r\n }, delay);\r\n //el.scrollIntoView({ block: 'start', inline: 'nearest', behavior: 'smooth' }); }, timeout);\r\n return true;\r\n }\r\n return false;\r\n}\r\n\r\nexport function findElement(selector) {\r\n if (typeof selector !== 'string') return selector;\r\n\r\n let found = querySelectorOrNull(selector)\r\n || querySelectorOrNull('#' + selector)\r\n || querySelectorOrNull('.' + selector)\r\n \r\n return found;\r\n}\r\n\r\nexport function querySelectorOrNull(selector) {\r\n try {\r\n return document.querySelector(selector);\r\n } catch(e){\r\n return null;\r\n };\r\n}\r\n\r\nexport function elementOffset(el) {\r\n var rect = el.getBoundingClientRect(),\r\n scrollLeft = typeof window !== `undefined` ? (window.pageXOffset || document.documentElement.scrollLeft) : 0,\r\n scrollTop = typeof window !== `undefined` ? (window.pageYOffset || document.documentElement.scrollTop) : 0;\r\n\r\n return { top: rect.top + scrollTop, left: rect.left + scrollLeft, width: el.offsetWidth, height: el.offsetHeight }\r\n}\r\n\r\nexport function isElementInViewport (el) {\r\n if (typeof window !== `undefined`) {\r\n var rect = el.getBoundingClientRect();\r\n\r\n return (\r\n rect.top >= 0 &&\r\n rect.left >= 0 &&\r\n rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /* or $(window).height() */\r\n rect.right <= (window.innerWidth || document.documentElement.clientWidth) /* or $(window).width() */\r\n );\r\n } else {\r\n return true;\r\n }\r\n}\r\n\r\nexport function getCurrentBreakpoint() {\r\n if (typeof window === `undefined`) return null;\r\n \r\n const bpHolder = document.querySelector('.devMediaQueryStatus__current');\r\n if (!bpHolder) return null;\r\n return window.getComputedStyle(bpHolder, ':before').getPropertyValue('content').replace(/[\"']/g, '');\r\n}\r\n\r\n","export function formatMoney(number, fraction = 0) {\r\n var formatter = new Intl.NumberFormat('en-AU', {\r\n style: 'currency',\r\n currency: 'AUD',\r\n minimumFractionDigits: fraction,\r\n });\r\n\r\n return formatter.format(number);\r\n}\r\n\r\nexport function toMonthlyCost(amount, frequency) {\r\n if (!amount) return 0;\r\n if (frequency === 'Week') {\r\n return amount * 52.1429 / 12.0;\r\n } else if (frequency === 'Fortnight') {\r\n return amount * 52.1429 / 2.0 / 12.0;\r\n } else if (frequency === 'Month') {\r\n return amount;\r\n } else if (frequency === 'Quarter') {\r\n return amount * 4.0 / 12.0;\r\n } else if (frequency === 'Year') {\r\n return amount / 12.0;\r\n } else {\r\n return amount;\r\n }\r\n}\r\n","export function isBlank(str) {\r\n return (!str || /^\\s*$/.test(str))\r\n}\r\n\r\nexport function isEmpty(str) {\r\n return (!str || str.length === 0)\r\n}\r\n\r\nexport function isNumeric(num){\r\n return !isNaN(num)\r\n}\r\n\r\nexport function capitalize(expression) {\r\n return expression.charAt(0).toUpperCase() + expression.slice(1);\r\n}\r\n\r\nexport function toFieldName(str) {\r\n if (!str) return null;\r\n return capitalize((str.replace(/([A-Z]+)/g, ' $1').replace(/([A-Z][a-z])/g, ' $1')).trim());\r\n}\r\n\r\nexport function toHtml(str) {\r\n if (!str) return null;\r\n return str.replace(/[\\n\\r]/g, '')\r\n}\r\n\r\n// Shorten a string to less than maxLen characters without truncating words.\r\nexport function truncateWords(str, maxLen, separator = ' ', ellipsis = '...') {\r\n if (str.length <= maxLen) return str\r\n var pos = str.lastIndexOf(separator, maxLen)\r\n return str.substr(0, pos) + ellipsis\r\n}\r\n\r\nexport function numberWithCommas(x) {\r\n var parts = x.toString().split(\".\");\r\n parts[0] = parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\r\n return parts.join(\".\");\r\n}\r\n\r\nexport const formatNumber = (value) => {\r\n if (value === 0) return '0';\r\n if (!value) return '';\r\n return Math.round(value * 100) / 100\r\n}","import shortid from 'shortid';\r\nimport uuid from 'uuid/v4';\r\n\r\nexport function shortId() {\r\n return shortid();\r\n}\r\n\r\nexport function guid() {\r\n return uuid();\r\n}","export function toCamel(o) {\r\n var newO, origKey, newKey, value\r\n if (o instanceof Array) {\r\n return o.map(function(value) {\r\n if (typeof value === \"object\") {\r\n value = toCamel(value)\r\n }\r\n return value\r\n })\r\n } else {\r\n newO = {}\r\n for (origKey in o) {\r\n if (o.hasOwnProperty(origKey)) {\r\n newKey = (origKey.charAt(0).toLowerCase() + origKey.slice(1) || origKey).toString()\r\n value = o[origKey]\r\n if (value instanceof Array || (value !== null && value.constructor === Object)) {\r\n value = toCamel(value)\r\n }\r\n newO[newKey] = value\r\n }\r\n }\r\n }\r\n return newO\r\n}","import classNames from 'classnames';\r\nimport * as url from './url';\r\nimport * as form from './form';\r\nimport * as array from './array';\r\nimport * as date from './date';\r\nimport * as css from './css';\r\nimport * as ui from './ui';\r\nimport * as money from './money';\r\nimport * as text from './text';\r\nimport * as random from './random';\r\nimport * as object from './object';\r\n\r\nexport default { classNames, url, form, array, date, css, ui, money, text, random, object};","import utils from \"utils\";\nimport env from 'env';\n\nexport const isMobile = () => {\n var width = utils.css.screenWidth()\n return width < 768\n}\n\nexport function resourcePath(url){\n return utils.url.isExternalLink(url)? url : env.resourceBase + url;\n}\n","import coreUtils from 'lib/utils-core';\nimport * as site from 'site/siteUtils';\n\nexport default { ...coreUtils, site };","import { useState, useEffect } from 'react';\r\nimport utils from '../../utils';\r\nimport siteConfig from '../../config';\r\n\r\nexport function useApi(fn) {\r\n //console.log('useApi')\r\n const [response, setResponse] = useState({});\r\n const [errors, setErrors] = useState([]);\r\n const [status, setStatus] = useState('ready');\r\n const [request, setRequest] = useState(null);\r\n\r\n useEffect(() => {\r\n if (!request) return;\r\n\r\n //console.log('fetch now')\r\n setResponse(null);\r\n setErrors([]);\r\n setStatus('ready');\r\n\r\n const fetchData = async () => {\r\n setStatus('pending');\r\n try {\r\n //console.log(request);\r\n const options = request.options || {}\r\n siteConfig.apiNetJwt && await siteConfig.apiNetJwt(options);\r\n\r\n const res = await fetch(request.url, options);\r\n //console.log(res);\r\n\r\n if (!res.ok) {\r\n try {\r\n const json = await res.json();\r\n console.log(json);\r\n\r\n if (json.message) {\r\n setErrors([json.message]);\r\n setStatus('error')\r\n return;\r\n }\r\n } catch (e) { }\r\n\r\n setErrors(['Error - ' + res.status + (res.statusText && (' - ' + res.statusText))]);\r\n setStatus('error')\r\n return;\r\n }\r\n\r\n //const json = await res.json();\r\n const text = await res.text();\r\n const json = text && text.length ? JSON.parse(text) : null;\r\n //console.log(json);\r\n\r\n // check if ajax result from c#\r\n if (json && json.errors && json.errors.length > 0) {\r\n setErrors(utils.form.getErrors(json));\r\n setStatus('error')\r\n return;\r\n }\r\n\r\n setResponse(json);\r\n setStatus('done')\r\n } catch (err) {\r\n //console.log(error, error.toString(), typeof error, JSON.stringify(error))\r\n setErrors([err.toString()]);\r\n setStatus('error')\r\n }\r\n };\r\n fetchData();\r\n }, [request]);\r\n\r\n const containsErrorMessage = (msg) => {\r\n const finding = (msg || '').toLowerCase()\r\n return errors.some(x => (x || '').toLowerCase().indexOf(finding) >= 0)\r\n }\r\n\r\n //return [ response, error, status, (...args) => setRequest(fn(...args)) ];\r\n return {\r\n request: request,\r\n response: response,\r\n errors: errors,\r\n status: status,\r\n hasErrors: () => status === 'error', \r\n containsErrorMessage: containsErrorMessage,\r\n addErrors: (errs) => {\r\n setErrors(...errors, ...errs)\r\n setStatus('error')\r\n },\r\n done: () => status === 'done',\r\n send: (...args) => {setStatus('ready'); setRequest(fn(...args))},\r\n sendRaw: (httpOptionFn, ...args) => {setStatus('ready'); setRequest(httpOptionFn(...args))},\r\n reset: () => {\r\n setStatus('ready');\r\n setErrors([]);\r\n }\r\n };\r\n}\r\n\r\nexport function usePost() {\r\n const formDataFn = (url, data, options = {}) =>\r\n ({\r\n url: url,\r\n options: {\r\n ...options,\r\n method: 'POST',\r\n body: data // FormData\r\n }\r\n });\r\n const post = useApi((url, data, options = {}) =>\r\n ({\r\n url: url,\r\n options: {\r\n ...options,\r\n method: 'POST',\r\n headers: { 'Content-Type': 'application/json' },\r\n body: JSON.stringify(data)\r\n }\r\n })\r\n );\r\n return {\r\n ...post,\r\n loading: () => post.status === 'ready' || post.status === 'pending',\r\n sending: () => post.status === 'pending',\r\n sendFormData: (...args) => post.sendRaw(formDataFn, ...args)\r\n }\r\n}\r\n\r\nexport function useGet() {\r\n const get = useApi((url, options = {}) =>\r\n ({\r\n url: url,\r\n options: {\r\n ...options,\r\n method: 'GET'\r\n }\r\n })\r\n );\r\n return {\r\n ...get,\r\n loading: () => get.status === 'ready' || get.status === 'pending'\r\n }\r\n}\r\n\r\n//https://medium.com/@jaryd_34198/seamless-api-requests-with-react-hooks-part-2-3ab42ba6ad5c","import utils from '../../utils';\r\n\r\nexport const MAX = 100000;\r\nexport const MIN = -100000;\r\n\r\nexport function getScrollProgress(el) {\r\n if (typeof window !== `undefined`) {\r\n const scroll = window.scrollY || window.pageYOffset\r\n if (!el) {\r\n console.log('not exists', el)\r\n return {\r\n progress: 0,\r\n top: scroll\r\n }\r\n }\r\n const boundsTop = el.getBoundingClientRect().top + scroll\r\n\r\n const viewport = {\r\n top: scroll,\r\n bottom: scroll + window.innerHeight,\r\n height: window.innerHeight\r\n }\r\n\r\n const bounds = {\r\n top: boundsTop,\r\n bottom: boundsTop + el.clientHeight,\r\n height: el.clientHeight\r\n }\r\n\r\n //const scrollTop = window.scrollY || window.pageYOffset || document.documentElement.scrollTop;\r\n\r\n // const status = {\r\n // viewport: viewport,\r\n // bound: bounds,\r\n // inViewport: (bounds.bottom >= viewport.top && bounds.bottom <= viewport.bottom)\r\n // || (bounds.top <= viewport.bottom && bounds.top >= viewport.top)\r\n // }\r\n\r\n //console.log((viewport.bottom - bounds.top) / (bounds.height + viewport.height))\r\n return {\r\n progress: (viewport.bottom - bounds.top) / (bounds.height + viewport.height),\r\n top: (viewport.bottom - bounds.top) / (viewport.height)\r\n }\r\n } else {\r\n return {\r\n progress: 0,\r\n top: 0\r\n }\r\n }\r\n}\r\n\r\n//au.setClass(section, 'animated', pr, [0.3, au.MAX])\r\nexport function setClass(el, className, pr, range)\r\n{\r\n if (pr >= range[0] && pr <= range[1]) {\r\n utils.css.addClass(el, className);\r\n } else {\r\n utils.css.removeClass(el, className);\r\n }\r\n}\r\n\r\nexport function prVal(min, max, pr, range = [0, 1]) {\r\n //console.log(min, max, typeof min, typeof to)\r\n if (pr < range[0]) return min;\r\n if (pr > range[1]) return max;\r\n return min + (max - min) * ((pr - range[0])/(range[1] - range[0]));\r\n}\r\n\r\nexport function transform(el, x, y) {\r\n el.style.transform = 'translate(' + x + ',' + y + ')';\r\n}\r\n\r\nexport function removeTransform(el) {\r\n\r\n}\r\n\r\n// requestAnimationFrame\r\n// const raf =\r\n// (
\r\n {auth.loggedIn() ? (\r\n \r\n {email}\r\n \r\n \r\n ) : (\r\n Login\r\n )}\r\n
)\r\n}","import React from 'react';\r\nimport { useAuth } from '../../../../auth';\r\nimport { useRouter } from '../../../../components';\r\n\r\nexport function Login(props) {\r\n const [username, setUsername] = React.useState(\"\");\r\n const [password, setPassword] = React.useState(\"\");\r\n const [error, setError] = React.useState(\"\");\r\n const [pending, setPending] = React.useState(false);\r\n const auth = useAuth();\r\n\r\n const router = useRouter();\r\n\r\n function submit(e) {\r\n setPending(true);\r\n //console.log('loggin', username, password)\r\n e.preventDefault();\r\n e.stopPropagation();\r\n\r\n auth.signin(username, password).then(user => {\r\n console.log(user)\r\n setPending(false);\r\n setError('')\r\n router.push('/admin/dashboard')\r\n }).catch(error => {\r\n console.log(error)\r\n setPending(false);\r\n setError(error.message)\r\n })\r\n\r\n }\r\n return (\r\n \r\n
)\r\n}","import React from 'react';\nimport { SiteLink } from 'components';\nimport { LoginStatus } from 'auth';\n\nexport function AppHeader() {\n return (\n Log In
\r\n\r\n {/*
\r\n \r\n \r\n\r\n {/*
\r\n \r\n Or Log in with \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n \r\n Forgot Password?\r\n \r\n
\r\n \r\n Don't have an account? Sign Up\r\n
*/}\r\n \n
\n );\n}\n","import React from 'react';\nimport { Route } from 'react-router-dom';\nimport { AppHeader } from 'layout/appHeader';\n\nconst LoginLayout = ({ children }) => (\n \n \n ![\"logo\"](\"/admin/assets/logos/logo.png\")
\n \n
\n \n \n
\n);\n\nconst LoginLayoutRoute = ({ component: RenderComponent, ...rest }) => {\n return (\n \n
\n \n {children}\n
\n \n
\n );\n}\n","import React from 'react';\nimport { Route } from 'react-router-dom';\n\nimport { AppHeader } from 'layout/appHeader';\nimport { AppSideBar } from 'layout/appSideBar';\n\nimport { useRouter } from '../components';\nimport { useAuth } from 'auth';\n\nconst DashboardLayout = ({ children, ...rest }) => {\n const { Redirect } = useRouter();\n const auth = useAuth();\n\n React.useEffect(() => {\n const checkAuth = async() => {\n if (!(await auth.loggedIn())) {\n return \n \n \n\n \n \n\n \n \n\n \n \n\n \n \n\n
\n Data
\n- \n
- \n
Products \n \n
WHERE TO BUY
\n- \n
- \n
Australia \n \n - \n
New Zealand \n \n
WARRANTY
\n- \n
- \n
Warranty Registrations \n \n
CONTACT
\n- \n
- \n
Contact Submission \n \n
JOIN
\n- \n
- \n
Join Submission \n \n
\n
\n )\n}\n\nconst DashboardLayoutRoute = ({ component: RenderComponent, ...rest }) => {\n return (\n \n
\n \n
\n \n {children}\n
\n | \n {column.render('Header')}\n {/* Add a sort direction indicator */}\n \n {column.isSorted\n ? column.isSortedDesc\n ? ' 🔽'\n : ' 🔼'\n : ''}\n \n | \n ))}\n
|---|
| {cell.render('Cell')} | \n )\n })}\n
Products
\n\n Add Product \n
\n \n \n {filterKeyword && clear filter}\n
\n {/* */}\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default TextInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction RadioListInput({ control, handleChange, formOption }) {\r\n const { name, label, value, errors, style, options, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n return (\r\n \r\n {prependText &&
\r\n {helpText && }\r\n \r\n
\r\n }\r\n\r\n handleChange(e, control)} \r\n // onBlur={(e) => handleChange(e, control, true)}\r\n onChange={changed}\r\n onKeyDown={keyDown}\r\n onBlur={blur}\r\n //onFocus={focus}\r\n //autoFocus={autoFocus}\r\n placeholder={placeHolder}\r\n className={\"form-control\" + (errors && errors.length > 0 ? ' is-invalid' : '')} {...attrs} />\r\n {prependText}
\r\n \r\n {fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nfunction checked(value, optionValue) {\r\n if (optionValue === null || typeof optionValue === 'undefined') return false;\r\n return value === optionValue;\r\n}\r\n\r\nexport default RadioListInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nconst CheckboxListInput = ({ control, handleChange, formOption }) => {\r\n const { name, label, value, errors, style, options, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n const values = value ? [...value] : [];\r\n return (\r\n \r\n {options && options.map((option, index) =>\r\n
\r\n {helpText && }\r\n \r\n handleChange(e, control)}\r\n value={option.value} id={fieldId + '_' + index} {...attrs} />\r\n \r\n
)}\r\n \r\n {fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nfunction checked(values, value) {\r\n if (value === null || typeof value === 'undefined') return false;\r\n return values.includes(value);\r\n}\r\n\r\nexport default CheckboxListInput;","import * as React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction DateSeparateInput({ control, handleChange, formOption }) {\r\n //const { name, label, value, errors, style } = control;\r\n const { name, label, errors, style, helpText, attrs } = control;\r\n const thisYear = (new Date()).getFullYear();\r\n //console.log(name, value)\r\n const [year, setYear] = React.useState('')\r\n const [month, setMonth] = React.useState('')\r\n const [day, setDay] = React.useState('')\r\n\r\n //const { template = 'bootstrap', usePlaceholder = false } = formOption;\r\n const fieldId = utils.random.shortId();\r\n const { usePlaceholder = false } = formOption;\r\n const fieldLabel = getLabel(control, formOption);\r\n //console.log(label, name + '|'+ fieldLabel)\r\n //const placeHolder = usePlaceholder ? fieldLabel : null;\r\n // let valueStr = value === 0 ? 0 : (value || \"\");\r\n // if (type === 'date' && value) {\r\n // valueStr = utils.date.formatYYYYMMDD(value);\r\n // }\r\n\r\n function handleChangeDay(e) {\r\n setDay(e.target.value)\r\n handleChangeInner(year, month, e.target.value)\r\n }\r\n\r\n function handleChangeMonth(e) {\r\n setMonth(e.target.value)\r\n handleChangeInner(year, e.target.value, day)\r\n }\r\n\r\n function handleChangeYear(e) {\r\n setYear(e.target.value)\r\n handleChangeInner(e.target.value, month, day)\r\n }\r\n\r\n function handleChangeInner(yyyy, mm, dd) {\r\n control.incomplete = !(yyyy !== '' && mm !== '' && dd !== '')\r\n const newVal = yyyy + '-' + mm + '-' + dd;\r\n //console.log(newVal)\r\n //mimic event\r\n handleChange({\r\n persist: () => { },\r\n target: { name: name, value: newVal, checked: false }\r\n }, control)\r\n }\r\n\r\n //const monthsFull = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\r\n const selectStyle = { width: 'auto', display: 'inline-block', marginRight: '0.5em' };\r\n\r\n const fromYear = style && style.recentYear ? thisYear : thisYear - 10;\r\n const recentYear = style && style.recentYear ? style.recentYear : 100;\r\n return (\r\n \r\n
\r\n {helpText && }\r\n \r\n {options && options.map((option, index) =>\r\n
\r\n \r\n handleChange(e, control)}\r\n value={option.value} id={fieldId + '_' + index} {...attrs}/>\r\n \r\n
)}\r\n\r\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default DateSeparateInput;","import * as React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction FileInput({ control, handleChange, formOption }) {\r\n const { name, label, type, value, errors, style, helpText, attrs } = control;\r\n //const { template = 'bootstrap', usePlaceholder = false } = formOption;\r\n const fieldId = utils.random.shortId();\r\n const { usePlaceholder = false } = formOption;\r\n const fieldLabel = getLabel(control, formOption);\r\n //console.log(label, control)\r\n const placeHolder = usePlaceholder ? fieldLabel : null;\r\n let valueStr = value === 0 ? 0 : (value || \"\");\r\n if (type === 'date' && value) {\r\n valueStr = utils.date.formatYYYYMMDD(value);\r\n }\r\n return (\r\n \r\n \r\n \r\n \r\n
\r\n {helpText && }\r\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n\r\n )\r\n}\r\n\r\nexport default FileInput;","import TextInput from './TextInput';\r\nimport RadioListInput from './RadioListInput';\r\nimport TextareaInput from './TextareaInput';\r\nimport CheckboxInput from './CheckboxInput';\r\nimport CheckboxListInput from './CheckboxListInput';\r\nimport SelectInput from './SelectInput';\r\nimport HiddenInput from './HiddenInput';\r\n//import HtmlInput from './HtmlInput';\r\nimport DateSeparateInput from './DateSeparateInput';\r\nimport FileInput from './FileInput';\r\n\r\nconst Components = { TextInput, RadioListInput, TextareaInput, CheckboxInput, CheckboxListInput, SelectInput, HiddenInput, DateSeparateInput, FileInput };\r\n\r\nconst capitalize = expression => expression.charAt(0).toUpperCase() + expression.slice(1);\r\n\r\nexport function getControl(control, formOption) {\r\n let Component = null;\r\n if (control.type === 'number' || control.type === 'email' || control.type === 'date' || control.type === 'password' || control.type === 'tel')\r\n Component = TextInput;\r\n else if (control.type === \"dob\")\r\n Component = DateSeparateInput;\r\n else\r\n Component = Components[capitalize(control.type || '') + 'Input'];\r\n\r\n return Component;\r\n}\r\n\r\n","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel, getLabelAsString } from '../formRenderHelper';\r\n\r\nfunction TextareaInput({ control, handleChange, formOption }) {\r\n const { name, label, type, value, errors, style, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n //const { template = 'bootstrap', usePlaceholder = false } = formOption;\r\n const { usePlaceholder = false } = formOption;\r\n const placeHolder = usePlaceholder ? getLabelAsString(control, formOption) : null;\r\n const valueStr = value === 0 ? 0 : (value || \"\");\r\n\r\n\r\n const textAreaRef = React.useRef(null);\r\n const [textAreaHeight, setTextAreaHeight] = React.useState(\"auto\");\r\n const [parentHeight, setParentHeight] = React.useState(\"auto\");\r\n\r\n React.useEffect(() => {\r\n if (textAreaRef.current) {\r\n const h = textAreaRef.current.scrollHeight > 60? textAreaRef.current.scrollHeight : 60\r\n setParentHeight(`${h}px`);\r\n setTextAreaHeight(`${h}px`);\r\n }\r\n }, [valueStr]);\r\n\r\n function onChangeInternal(e) {\r\n setTextAreaHeight(\"auto\");\r\n if (textAreaRef.current) {\r\n const h = textAreaRef.current.scrollHeight > 60? textAreaRef.current.scrollHeight : 60\r\n setParentHeight(`${h}px`);\r\n }\r\n handleChange(e, control);\r\n }\r\n\r\n return (\r\n \r\n handleChange(e, control)} onBlur={(e) => handleChange(e, control)}\r\n placeholder={placeHolder}\r\n className={\"form-control-file\" + (errors && errors.length > 0 ? ' is-invalid' : '')} {...attrs}/>\r\n
\r\n {helpText && }\r\n \r\n {!usePlaceholder && fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default TextareaInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nconst CheckboxInput = ({ control, handleChange, formOption }) => {\r\n const { name, label, type, value, errors, style, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n return (\r\n \r\n \r\n
\r\n {helpText && }\r\n \r\n handleChange(e, control)} \r\n className={\"form-check-input\"} {...attrs}/>\r\n \r\n {helpText && }\r\n
\r\n )\r\n}\r\n\r\nexport default CheckboxInput;","import React from 'react';\r\nimport ValidationAlert from '../components/ValidationAlert';\r\nimport utils from '../../../utils';\r\nimport { getLabel } from '../formRenderHelper';\r\n\r\nfunction SelectInput({ control, handleChange, formOption }) {\r\n const { name, label, type, value, errors, style, options, helpText, attrs } = control;\r\n const fieldId = utils.random.shortId();\r\n const fieldLabel = getLabel(control, formOption);\r\n //console.log(value, typeof value)\r\n return (\r\n \r\n {fieldLabel && }\r\n
\r\n )\r\n}\r\n\r\nexport default SelectInput;\r\n\r\n","import * as React from 'react';\r\nimport utils from '../../../utils';\r\n\r\nfunction TextInput({ control, handleChange, formOption }) {\r\n const { name, value } = control;\r\n const fieldId = utils.random.shortId();\r\n let valueStr = value === 0 ? 0 : (value || \"\");\r\n\r\n\r\n return (\r\n \r\n )\r\n}\r\n\r\nexport default TextInput;","import React from 'react';\r\nimport * as formModelHelper from './formModelHelper';\r\nimport { getControl } from './controls';\r\nimport { getSiteControl } from '../../form';\r\n\r\nexport function renderControlDirect(control, handleChange, formOption) {\r\n if (control === null) return null;\r\n let Component = getSiteControl(control, formOption) || getControl(control, formOption);\r\n if (!Component) return control.value;\r\n return \r\n \r\n
\r\n {helpText && }\r\n \r\n {!usePlaceholder && fieldLabel && }\r\n {/* {
\r\n )\r\n}\r\n\r\nexport default HtmlInput;","export const categories = [\n { category: 'Breakfast', segments: ['Kettle'] },\n { category: 'Cooking', segments: [] },\n { category: 'Food Preparation', segments: [] },\n { category: 'Dessert', segments: [] },\n { category: 'Cookware', segments: [] },\n { category: 'Utensils', segments: [] },\n { category: 'Air Purification', segments: [] }\n]\n\nexport const styles = [\n 'Volume',\n 'Straight',\n 'Curls',\n 'Waves',\n 'Length',\n 'Occasion'\n]\n","import { fb, validators } from \"form\";\nimport { categories, styles } from \"site/data\";\n\nexport function getProductEditModel(data) {\n // let projectList = data.projectList.map((p) => { return { name: getProjectName(p), value: p.projectCode }});\n // projectList = [{ name: 'Select...', value: '' }, ...projectList];\n\n let categoryList = categories.map((x) => {\n return { name: x.category, value: x.category };\n });\n categoryList = [{ name: \"Select...\", value: \"\" }, ...categoryList];\n\n const statusList = [\n { name: \"Live\", value: \"0\" },\n { name: \"Archived\", value: \"97\" },\n { name: \"Discontinued\", value: \"98\" },\n { name: \"N/A\", value: \"99\" },\n ];\n\n const styleList = styles.map((x) => {\n return { name: x, value: x };\n });\n const filterList = data.filterList.map((x) => {\n return { name: x.filterName, value: x.filterCode };\n });\n\n console.log(\"getProductEditModel\", data);\n\n const model = fb.group({\n productStatusAU: [\n data.productStatusAU,\n [validators.Required()],\n { type: \"select\", options: statusList },\n ],\n productStatusNZ: [\n data.productStatusNZ,\n [validators.Required()],\n { type: \"select\", options: statusList },\n ],\n\n productCode: [\n data.productCode || \"\",\n [validators.Required()],\n { type: \"text\" },\n ],\n productName: [\n data.productName || \"\",\n [validators.Required()],\n { type: \"text\" },\n ],\n productUrl: [\n data.productUrl || \"\",\n [validators.Required()],\n { type: \"text\" },\n ],\n bookletLink: [data.bookletLink || \"\", [], { type: \"text\" }],\n metaImage: [data.metaImage || \"\", [], null],\n recipeBookletLink: [data.recipeBookletLink || \"\", [], { type: \"text\" }],\n category: [\n data.category || \"\",\n [validators.Required()],\n { type: \"select\", options: categoryList },\n ],\n category2: [\n data.category2 || \"\",\n [],\n { type: \"select\", options: categoryList },\n ],\n barcode: [data.barcode || \"\", [], { type: \"text\" }],\n barcodeUPC: [\n data.barcodeUPC || \"\",\n [],\n { label: \"Barcode(UPC)\", type: \"text\" },\n ],\n styles: [\n data.styles || [],\n [],\n { type: \"checkboxList\", options: styleList, style: { inline: true } },\n ],\n filters: [\n data.filters || [],\n [],\n { type: \"checkboxList\", options: filterList, style: { inline: true } },\n ],\n priceAU: [data.priceAU || \"\", [], { type: \"number\", label: \"Price (AU$)\" }],\n priceNZ: [data.priceNZ || \"\", [], { type: \"number\", label: \"Price (NZ$)\" }],\n warranty: [\n data.warranty || \"\",\n [],\n { type: \"text\", label: \"Waranty Year\" },\n ],\n relatedProducts: [\n data.relatedProducts.join(\"\\n\") || \"\",\n [],\n {\n type: \"textarea\",\n label: \"Related Products - product code in each line\",\n style: { rows: 10 },\n },\n ],\n productImages: [data.productImages || [], [], null],\n productStores: [data.productStores || [], [], null],\n intro: [data.intro || \"\", [], { type: \"textarea\", style: { rows: 7 } }],\n metaDesc: [\n data.metaDesc || \"\",\n [],\n {\n type: \"textarea\",\n label: \"Meta Description (if empty, Intro will be used)\",\n style: { rows: 7 },\n },\n ],\n // forAU: [data.forAU, [], { label: \"AU\", type: \"checkbox\" }],\n // forNZ: [data.forNZ, [], { label: \"NZ\", type: \"checkbox\" }],\n trendingNow: [\n data.trendingNow || \"\",\n [],\n { label: \"Trending Now\", type: \"checkbox\" },\n ],\n useSparePartInstruction: [\n data.useSparePartInstruction || \"\",\n [],\n { label: \"Use common Spare Part Instruction\", type: \"checkbox\" },\n ],\n\n sortingOrder: [\n data.sortingOrder || \"\",\n [],\n {\n type: \"text\",\n label: \"Sorting Order (any text)\",\n helpText:\n \"Done by character sorting, not numeric sorting, i.e., 12 comes before 2. Use paddings if you are going to use numbers like 001, 002, 012. You may use any group name here.\",\n },\n ],\n mpn: [\n data.mpn || \"\",\n [],\n {\n type: \"text\",\n label: \"MPN (If empty, Product Code(non SKU_*) will be used)\",\n helpText:\n 'More info(Google)',\n },\n ],\n mfTitle: [\n data.mfTitle || \"\",\n [],\n {\n type: \"text\",\n label:\n \"Title (If empty, Sitename + Product Name + Product Code(non SKU_*) will be used)\",\n helpText:\n 'More info(Google)',\n },\n ],\n mfDesc: [\n data.mfDesc || \"\",\n [],\n {\n type: \"textarea\",\n label: \"Description (if empty, Intro will be used)\",\n style: { rows: 7 },\n helpText:\n 'More info(Google)',\n },\n ],\n mfProductType1: [\n data.mfProductType1 || \"\",\n [],\n {\n type: \"text\",\n label: \"Product Type (categorisation, i.e., Women > Hair Dryer > ...)\",\n },\n ],\n mfProductType2: [\n data.mfProductType2 || \"\",\n [],\n { type: \"text\", label: null },\n ],\n mfProductType3: [\n data.mfProductType3 || \"\",\n [],\n { type: \"text\", label: null },\n ],\n mfProductType4: [\n data.mfProductType4 || \"\",\n [],\n { type: \"text\", label: null },\n ],\n mfProductType5: [\n data.mfProductType5 || \"\",\n [],\n { type: \"text\", label: null },\n ],\n // details: [data.details || '', [], { type: 'html', style: { } }],\n // styleTips: [data.styleTips || '', [], { type: 'html', style: { } }],\n // seeMore: [data.seeMore || '', [], { type: 'html', style: { } }],\n // specifications: [data.specifications || '', [], { type: 'html', style: { } }],\n howToSection: fb.array([]),\n discoverMoreSection: fb.array([]),\n faqSection: fb.array([]),\n whereToBuySection: fb.array([]),\n detailSection: fb.array([]),\n specSection: fb.array([]),\n seeMoreSection: fb.array([]),\n //youtubeSection : fb.array([]),\n });\n\n // const itemArray = model.find('detailSection').controls;\n // data.detailSection.forEach(item => {\n // itemArray.push(fb.group({\n // itemValue: [item.itemValue || '', [], { type: 'html', label: null, style: { } }],\n // itemStatus: [item.itemStatus, [], { type: 'select', style: { } }],\n // itemId: [item.itemId],\n // itemTypeCode: [item.itemTypeCode]\n // }))\n // })\n\n buildArray(data.howToSection, model.find(\"howToSection\").controls);\n buildArray(\n data.discoverMoreSection,\n model.find(\"discoverMoreSection\").controls\n );\n buildArray(data.faqSection, model.find(\"faqSection\").controls);\n buildArray(data.whereToBuySection, model.find(\"whereToBuySection\").controls);\n buildArray(data.detailSection, model.find(\"detailSection\").controls);\n buildArray(data.specSection, model.find(\"specSection\").controls);\n buildArray(data.seeMoreSection, model.find(\"seeMoreSection\").controls);\n //buildArray(data.youtubeSection, model.find('youtubeSection').controls);\n\n return model;\n}\n\nfunction buildArray(items, itemArray) {\n items.forEach((item) => {\n itemArray.push(createGroup(item));\n });\n}\n\nconst specSectionList = [\n { name: \"Left\", value: \"L\" },\n { name: \"Right\", value: \"R\" },\n];\n//const linkTypeList = [{ name: 'Auto', value: 'auto' }, { name: 'Blog', value: 'blog' }, { name: 'Instagram', value: 'instagram' }, { name: 'Web', value: 'web' }];\nconst linkTypeList = [\n { name: \"Auto\", value: \"auto\" },\n { name: \"Instagram\", value: \"instagram\" },\n { name: \"Tiktok\", value: \"tiktok\" },\n];\n\nexport function createGroup(item) {\n const group = {\n itemStatus: [item.itemStatus, [], { type: \"select\", style: {} }],\n itemId: [item.itemId],\n itemTypeCode: [item.itemTypeCode],\n };\n\n const g = fb.group({ ...group, ...createItem(item) });\n g.customValueFn = getItemValue;\n return g;\n}\n\nexport function createItem(item) {\n if (item.itemTypeCode === \"video\") {\n if (!item.itemValue) return null;\n const video = JSON.parse(item.itemValue);\n //console.log(video);\n return {\n videoUrl: [\n video.video || \"\",\n [],\n { type: \"text\", label: \"Youtube Id or Url\" },\n ],\n title: [video.title || \"\", [], { type: \"text\", label: \"Title\" }],\n desc: [\n video.desc || \"\",\n [],\n { type: \"html\", label: \"Short Description\", style: {} },\n ],\n };\n }\n\n if (item.itemTypeCode === \"qa\") {\n if (!item.itemValue) return null;\n const qa = JSON.parse(item.itemValue);\n //console.log(video);\n return {\n question: [\n qa.question || \"\",\n [],\n { type: \"textarea\", label: \"Question\" },\n ],\n answer: [\n qa.answer || \"\",\n [],\n { type: \"html\", label: \"Answer\", style: {} },\n ],\n };\n }\n\n if (item.itemTypeCode === \"spec\") {\n if (!item.itemValue) return null;\n const spec = JSON.parse(item.itemValue);\n //console.log(video);\n return {\n category: [\n spec.category || \"\",\n [],\n { type: \"select\", label: \"Section\", options: specSectionList },\n ],\n label: [spec.label || \"\", [], { type: \"text\", label: \"Label\" }],\n text: [\n spec.text || \"\",\n [],\n { type: \"text\", label: \"Specification\", style: {} },\n ],\n };\n }\n\n if (item.itemTypeCode === \"html\") {\n return {\n html: [\n item.itemValue || \"\",\n [],\n { type: \"html\", label: null, style: {} },\n ],\n };\n }\n\n if (item.itemTypeCode === \"link\") {\n if (!item.itemValue) return null;\n const link = JSON.parse(item.itemValue);\n return {\n linkType: [\n link.linkType || \"auto\",\n [],\n { type: \"select\", label: \"Type\", options: linkTypeList },\n ],\n title: [link.title || \"\", [], { type: \"text\", label: \"Title\" }],\n url: [link.url || \"\", [], { type: \"text\", label: \"URL\", style: {} }],\n };\n }\n\n if (item.itemTypeCode === \"weblink\") {\n if (!item.itemValue) return null;\n const link = JSON.parse(item.itemValue);\n return {\n //linkType: [link.linkType || 'auto', [], { type: 'select', label: 'Type', options: linkTypeList }],\n title: [link.title || \"\", [], { type: \"text\", label: \"Title\" }],\n url: [link.url || \"\", [], { type: \"text\", label: \"URL\", style: {} }],\n };\n }\n}\n\nfunction getItemValue(item, fns) {\n const val = (name) => {\n const control = item.find(name);\n return control ? control.value : null;\n };\n const value = {\n itemStatus: val(\"itemStatus\"),\n itemId: val(\"itemId\"),\n itemTypeCode: val(\"itemTypeCode\"),\n };\n\n if (value.itemTypeCode === \"video\") {\n value.itemValue = JSON.stringify({\n video: val(\"videoUrl\"),\n title: val(\"title\"),\n desc: val(\"desc\"),\n });\n } else if (value.itemTypeCode === \"qa\") {\n value.itemValue = JSON.stringify({\n question: val(\"question\"),\n answer: val(\"answer\"),\n });\n } else if (value.itemTypeCode === \"spec\") {\n value.itemValue = JSON.stringify({\n category: val(\"category\"),\n label: val(\"label\"),\n text: val(\"text\"),\n });\n } else if (value.itemTypeCode === \"html\") {\n value.itemValue = val(\"html\");\n } else if (value.itemTypeCode === \"link\") {\n value.itemValue = JSON.stringify({\n linkType: val(\"linkType\"),\n title: val(\"title\"),\n url: val(\"url\"),\n });\n } else if (value.itemTypeCode === \"weblink\") {\n value.itemValue = JSON.stringify({ title: val(\"title\"), url: val(\"url\") });\n }\n return value;\n}\n","import React from \"react\";\nimport env from \"env\";\nimport utils from \"utils\";\nimport { DragDropContext, Droppable, Draggable } from \"react-beautiful-dnd\";\n\nexport function ImageSelector({ form, fieldName, data }) {\n const field = form.findControl(fieldName);\n //console.log(field, fieldName)\n\n React.useLayoutEffect(() => {\n const handleMessage = (e) => {\n //console.log(e);\n var action = e.data.action;\n var onSelection = e.data.onSelection;\n var data = e.data.data;\n\n if (action === \"media-selected\") {\n if (onSelection === \"selectedMediaFiles\") {\n selectedMediaFiles(data);\n }\n }\n };\n window.addEventListener(\"message\", handleMessage);\n\n return () => window.removeEventListener(\"message\", handleMessage);\n // eslint-disable-next-line\n }, []);\n\n function openLibrary(e) {\n var url = env.cmsEndpoint + \"/cms41helper/browse/selectmedia?onSelection=selectedMediaFiles&maxSelect=100\";\n var w = window.innerWidth;\n var h = window.innerHeight;\n window.open(url, \"cms_library\", `toolbar=yes,scrollbars=yes,resizable=yes,top=${w * 0.05},left=${h * 0.05},width=${w * 0.9},height=${h * 0.9}`);\n }\n\n function selectedMediaFiles(items) {\n //const field = form.findControl(fieldName);\n if (!field) return;\n\n //console.log(items)\n let obj = items;\n\n field.value = field.value || [];\n for (var i in obj.items) {\n field.value.push({\n imageUrl: obj.items[i].WebPath,\n alt: obj.items[i].Alt,\n isPackage: false,\n forAU: true,\n forNZ: true,\n youtubeUrl: \"\",\n youtubeCheck: false,\n });\n }\n form.reset();\n }\n\n // const reorder = (list, startIndex, endIndex) => {\n // const result = Array.from(list);\n // const [removed] = result.splice(startIndex, 1);\n // result.splice(endIndex, 0, removed);\n\n // return result;\n // };\n\n // const removeItem = (list, index) => {\n // const result = Array.from(list);\n // result.splice(index, 1);\n\n // return result;\n // };\n\n function remove(e, index) {\n //if (!window.confirm('Delete this??')) return;\n field.value = utils.array.removeItem(field.value || [], index);\n form.reset();\n }\n\n function packageChanged(e, index) {\n (field.value || [])[index].isPackage = e.target.checked;\n //console.log(field)\n form.reset();\n }\n\n function onAUChanged(e, index) {\n (field.value || [])[index].forAU = e.target.checked;\n //console.log(field)\n form.reset();\n }\n\n function onNZChanged(e, index) {\n (field.value || [])[index].forNZ = e.target.checked;\n //console.log(field)\n form.reset();\n }\n\n function youtubeCheckChanged(e, index) {\n (field.value || [])[index].youtubeCheck = e.target.checked;\n //console.log(field)\n form.reset();\n }\n\n function youtubeUrlChanged(e, index) {\n (field.value || [])[index].youtubeUrl = e.target.value;\n //console.log(field)\n form.reset();\n }\n\n function onDragEnd(result) {\n //console.log(result)\n //const field = form.findControl(fieldName);\n if (!field) return;\n\n // dropped outside the list\n if (!result.destination) {\n return;\n }\n\n field.value = utils.array.moveItem(field.value || [], result.source.index, result.destination.index);\n\n form.reset();\n }\n\n return (\n \r\n {\r\n // console.log(valueStr, control.id)\r\n // editor.controlId = control.id;\r\n // console.log( Array.from( editor.ui.componentFactory.names() ) )\r\n // // You can store the \"editor\" and use when it is needed.\r\n // console.log('Editor is ready to use!', editor);\r\n }}\r\n onChange={(event, editor) => {\r\n const data = editor.getData();\r\n handleChangeInner(data);\r\n //console.log({ event, editor, data });\r\n }}\r\n />\r\n
\r\n \r\n \r\n \r\n
\r\n\r\n \r\n \r\n \r\n
\r\n\r\n {helpText && }\r\n \n \n \n {(provided, snapshot) => (\n \n {(field.value || []).map((item, index) => (\n \n {(provided, snapshot) => (\n \n
\n )}\n \n ))}\n {provided.placeholder}\n \n )}\n \n \n\n \n \n );\n}\n\nfunction ImageListItem({ image, index, onRemove, onPackageChanged, onAUChanged, onNZChanged, onYoutubeCheckChanged, onYoutubeUrlChanged }) {\n return (\n <>\n \n })
\n
\n \n
\n \n );\n}\n","import React from 'react';\nimport env from 'env';\n\nexport function MediaSelector({ form, fieldName, data }) {\n\n const field = form.findControl(fieldName);\n //console.log(field, fieldName)\n\n React.useLayoutEffect(() => {\n const handleMessage = (e) => {\n //console.log(e);\n var action = e.data.action;\n var onSelection = e.data.onSelection;\n var data = e.data.data;\n\n if (action === 'media-selected') {\n const fldName = onSelection.replace('selectedMediaFiles_', '')\n if (fldName === fieldName) {\n selectedMediaFiles(data);\n } \n }\n }\n window.addEventListener('message', handleMessage)\n\n return () => window.removeEventListener('message', handleMessage)\n // eslint-disable-next-line\n }, [])\n\n function openLibrary(e) {\n const defPath = '/sites/cuisinart/media/information-booklets';\n var url = (env.cmsEndpoint) + `/cms41helper/browse/selectmedia?onSelection=selectedMediaFiles_${fieldName}&defPath=${defPath}&maxSelect=1`;\n var w = window.innerWidth;\n var h = window.innerHeight;\n window.open(url, 'cms_library', `toolbar=yes,scrollbars=yes,resizable=yes,top=${w * 0.05},left=${h * 0.05},width=${w * 0.9},height=${h * 0.9}`);\n\n }\n\n function selectedMediaFiles(items) {\n //const field = form.findControl(fieldName);\n if (!field) return;\n\n console.log(items)\n let obj = items;\n\n field.value = field.value || '';\n if (obj.items.length > 0) {\n field.value = obj.items[0].WebPath\n }\n form.reset()\n }\n\n return (\n \n \n
\n \n \n
\n \n \n
\n \n \n \n
\n\n \n \n onYoutubeUrlChanged(e, index)}\n />\n
\n\n \n \n
\n \n\n \n
\n );\n}","import React from \"react\";\nimport env from \"env\";\nimport utils from \"utils\";\n//import { DragDropContext, Droppable, Draggable } from \"react-beautiful-dnd\";\n\nexport function MetaImageSelector({ form, fieldName, data }) {\n const field = form.findControl(fieldName);\n //console.log(field, fieldName)\n\n React.useLayoutEffect(() => {\n const handleMessage = (e) => {\n //console.log(e);\n var action = e.data.action;\n var onSelection = e.data.onSelection;\n var data = e.data.data;\n\n if (action === \"media-selected\") {\n if (onSelection === \"selectedMediaFiles\") {\n selectedMediaFiles(data);\n }\n }\n };\n window.addEventListener(\"message\", handleMessage);\n\n return () => window.removeEventListener(\"message\", handleMessage);\n // eslint-disable-next-line\n }, []);\n\n function openLibrary(e) {\n var url = env.cmsEndpoint + \"/cms41helper/browse/selectmedia?onSelection=selectedMediaFiles&maxSelect=1\";\n var w = window.innerWidth;\n var h = window.innerHeight;\n window.open(url, \"cms_library\", `toolbar=yes,scrollbars=yes,resizable=yes,top=${w * 0.05},left=${h * 0.05},width=${w * 0.9},height=${h * 0.9}`);\n }\n\n function selectedMediaFiles(items) {\n //const field = form.findControl(fieldName);\n if (!field) return;\n //console.log(items)\n let obj = items;\n field.value = field.value || '';\n if (obj.items.length > 0) {\n // field.value = {\n // imageUrl: obj.items[0].WebPath,\n // alt: obj.items[0].Alt\n // }\n field.value = obj.items[0].WebPath;\n }\n form.reset();\n }\n\n function remove(e) {\n //if (!window.confirm('Delete this??')) return;\n field.value = '';\n form.reset();\n }\n\n return (\n \n\n {\n field.value &&\n
\n );\n}\n\nfunction ImageListItem({ image, onRemove, alt }) {\n return (\n <>\n \n })
\n
\n \n
\n \n );\n}","import React from 'react'\nimport utils from 'utils'\nimport { useForm } from 'form'\nimport { Button, ErrorMessage } from 'components'\nimport fb from 'lib/form/formBuilder'\n\nexport function StoreSelector({ form, data, fieldName }) {\n const [editingStore, setEditingStore] = React.useState()\n\n const field = form.findControl(fieldName)\n const storesInFrom = field.value || []\n const stores = (data.stores || []).filter((x) => x.storeName)\n\n // form data for the right hand store editor\n const editingStoreForm = useForm({}, {})\n\n function onStoreSelectChanged(e) {\n let currentStores = field.value || []\n if (e.target.checked) {\n //add\n currentStores.push({\n storeCode: e.target.value,\n buyOnlineOverride: null,\n storeUrlOverride: null,\n notes: null,\n })\n } else {\n //remove\n currentStores = currentStores.filter(\n (x) => x.storeCode !== e.target.value\n )\n }\n field.value = currentStores\n form.reset()\n }\n\n function onEdit(storeCode) {\n let currentStores = field.value || []\n const store = utils.array.find(\n currentStores,\n (x) => x.storeCode === storeCode\n )\n resetEditingStoreModel(store)\n setEditingStore(store)\n }\n\n function onEditSaved(storeCode, store) {\n let currentStores = field.value || []\n currentStores = currentStores.filter((x) => x.storeCode !== storeCode)\n currentStores.push(store)\n field.value = currentStores\n form.reset()\n setEditingStore(null) // close editor\n }\n\n function onCancel() {\n setEditingStore(null) // close editor\n }\n\n function resetEditingStoreModel(store) {\n const storeInData = utils.array.find(\n data.stores,\n (x) => x.storeCode === store.storeCode\n )\n const buyOnlineOptions = [\n {\n name:\n 'Use default store setting (' +\n (storeInData.buyOnline ? 'Buy Online' : 'No Online') +\n ')',\n value: '',\n },\n { name: 'Buy Online', value: true },\n { name: 'No Online', value: false },\n ]\n const model = fb.group({\n buyOnlineOverride: [\n store.buyOnlineOverride === false\n ? false\n : store.buyOnlineOverride || '',\n [],\n {\n type: 'select',\n label: 'Overriding Buy Online',\n options: buyOnlineOptions,\n },\n ],\n storeUrlOverride: [\n store.storeUrlOverride || '',\n [],\n { type: 'text', label: 'Overriding Link' },\n ],\n notes: [store.notes || '', [], { type: 'text', label: 'Notes' }],\n storeInData: [storeInData],\n })\n editingStoreForm.reset(model)\n }\n\n return (\n \n \n
\n \n
\n )\n}\n\nfunction Store({ storesInFrom, storeInData, onStoreSelectChanged, onEdit }) {\n const forProduct = utils.array.find(\n storesInFrom,\n (x) => x.storeCode === storeInData.storeCode\n )\n const overrides = []\n if (forProduct) {\n // console.log(typeof forProduct.buyOnlineOverride)\n // console.log(forProduct.buyOnlineOverride, forProduct.buyOnlineOverride === true, forProduct.buyOnlineOverride === false)\n\n // if (forProduct.buyOnlineOverride === 'true'){\n // overrides.push(`Buy Online`)\n // } else if (forProduct.buyOnlineOverride === 'false'){\n // overrides.push(`No Online`)\n // }\n // if (forProduct.storeUrlOverride) {\n // overrides.push(`Store Url: ${forProduct.storeUrlOverride}`);\n // }\n if (\n forProduct.buyOnlineOverride === 'true' ||\n forProduct.buyOnlineOverride === true\n ) {\n overrides.push(`Buy Online`)\n } else if (\n forProduct.buyOnlineOverride === 'false' ||\n forProduct.buyOnlineOverride === false\n ) {\n overrides.push(`No Online`)\n }\n if (forProduct.storeUrlOverride) {\n overrides.push(`Store Url: ${forProduct.storeUrlOverride}`)\n }\n }\n\n return (\n \n
\n \n {stores.map((store, index) => (\n
\n \n {editingStore && (\n
\n \n \n {forProduct && forProduct.notes && (\n ({forProduct.notes})\n )}\n {!!forProduct && (\n {\n onEdit(storeInData.storeCode)\n }}\n >\n Edit\n \n )}\n\n {overrides.length > 0 && (\n
\n )\n}\n\nfunction StoreEdit({ form, store, stores, onChange, onCancel }) {\n const storeInData = utils.array.find(\n stores,\n (x) => x.storeCode === store.storeCode\n )\n console.log(store, storeInData)\n\n function save(e) {\n form.validateForm(e, () => {\n const value = { ...form.getValue(), storeCode: store.storeCode }\n onChange(store.storeCode, value)\n })\n }\n\n const render = (name) => form.renderControl(name)\n return (\n {overrides.join('\\n')}
\n )}\n \n
\n )\n}\n","import React from \"react\";\nimport env from \"env\";\nimport { Redirect, Link } from \"react-router-dom\";\nimport { usePost } from \"components\";\nimport { useForm } from \"form\";\nimport { Button, ErrorMessage } from \"components\";\nimport { ImageSelector } from \"./imageSelector\";\nimport { MediaSelector } from \"./mediaSelector\";\nimport { MetaImageSelector } from \"./metaImageSelector\";\nimport { StoreSelector } from \"./storeSelector\";\nimport utils from \"utils\";\nimport { DragDropContext, Droppable, Draggable } from \"react-beautiful-dnd\";\nimport { FaGripLines, FaRegEyeSlash, FaRegEye, FaTrash } from \"react-icons/fa\";\nimport { createGroup } from \"./productEditFormModel\";\n\nexport function ProductEditForm({ model, data, productCode }) {\n const form = useForm(model, {});\n const post = usePost();\n const [currentTab, setCurrentTab] = React.useState(\"details\");\n\n const render = (name) => form.renderControl(name);\n\n function save(e) {\n form.validateForm(e, () => {\n const value = { ...form.getValue(), orgProductCode: productCode };\n value.relatedProducts = value.relatedProducts\n ? value.relatedProducts.split(\"\\n\")\n : [];\n post.send(env.apiBase + \"/api/productAdmin/saveProduct\", value);\n });\n }\n\n // function remove(e) {\n // if (!window.confirm(\"Delete this??\")) return;\n // post.send(env.apiBase + \"/api/productAdmin/removeProduct\", { productCode: productCode });\n // }\n\n function suggestUrl() {\n const value = form.getValue();\n const productUrl = form.findControl(\"productUrl\");\n productUrl.value = \"/products/\" + utils.url.getSlug(value.productName);\n form.reset();\n }\n // if (post.hasErrors()) {\n // return \n Editing '[{storeInData.country}] {storeInData.storeName}'\n
\n\n The following settings are for this product only.\n
\n{render('buyOnlineOverride')}
\n {render('storeUrlOverride')}
\n {render('notes')}
\n\n \n
\n \n \n \n
\n \n \n
\n\n \n {/* {data.productUrl && Product page} */}\n {formVal.productStatusAU !== 99 && (\n \n Product (AU)\n \n )}\n {formVal.productStatusNZ !== 99 && (\n \n Product (NZ)\n \n )}\n {/* {data.migProductUrl && (\n \n Old page\n \n )} */}\n
\n Product Edit
\n\n\n
\n {render(\"productCode\")}
\n \n {render(\"category\")}
\n {render(\"category2\")}
\n \n
\n {render(\"productName\")}
\n \n {render(\"productUrl\")}\n
\n \n \n Suggest URL from product name\n \n
\n \n
\n\n \n \n
\n \n
\n\n {render(\"productStatusAU\")}
\n {render(\"productStatusNZ\")}
\n \n
\n\n {render(\"priceAU\")}
\n {render(\"priceNZ\")}
\n \n
\n {render(\"warranty\")}
\n \n \n {render(\"useSparePartInstruction\")}\n
\n \n
\n {render(\"barcode\")}
\n {render(\"barcodeUPC\")}
\n \n
\n \n {render(\"bookletLink\")}\n
\n \n
\n \n {render(\"recipeBookletLink\")}\n
\n \n \n
\n \n
\n \n
\n {/* {data.menOrWomen === 'W' && render('styles')} */}\n \n {render(\"trendingNow\")}\n {render(\"filters\")}\n {render(\"sortingOrder\")}
\n \n
\n \n {render(\"intro\")}\n
\n \n {render(\"metaDesc\")}\n
\n \n
\n \n\n {/* \n
\n\n \n {tabs.map((tab) => (\n showTab(tab.id)}\n >\n {tab.title}\n
\n ))}\n \n {tabs.map((tab) => (\n \n
\n ))}\n \n
\n \n
\n \n \n {render('details')}
\n \n
*/}\n \n\n \n
\n {render('styleTips')}
\n \n
\n {render('specifications')}
\n \n
\n {render('seeMore')}
\n \n
\n \n \n );\n}\n\nfunction WordCounter({ form, field, forMeta }) {\n const val = form.getValue()[field];\n const length = (val || \"\").length;\n const style = {\n color: forMeta\n ? length < 50 || length > 160\n ? \"red\"\n : \"limegreen\"\n : \"#666\",\n fontSize: \"0.8rem\",\n };\n return (\n \n
\n \n {length} {length === 1 ? \"character\" : \"characters\"}\n {forMeta && (\n \n (50-160 characters recommended)\n \n )}\n
\n );\n}\n\n// function HowtoTab({ form }) {\n// const section = form.findControl('howToSection');\n// const addOptions = [\n// { name: 'Html', itemTypeCode: 'html' },\n// { name: 'Video', itemTypeCode: 'video' }\n// ]\n// return \n
\n );\n}\n\nfunction EditorPanel({ form, section, addOptions }) {\n //const section = form.findControl('detailSection');\n //console.log(section)\n //return null;\n // section.controls.map((item, index) => {\n // console.log(item.controls[0].value)\n // });\n\n function onDragEnd(result) {\n //console.log(result)\n\n // dropped outside the list\n if (!result.destination) {\n return;\n }\n\n //console.log(JSON.stringify(section))\n section.controls = utils.array.moveItem(\n Array.from(section.controls || []),\n result.source.index,\n result.destination.index\n );\n // console.log(JSON.stringify(section))\n // console.log(JSON.stringify(form.model))\n form.reset();\n }\n\n function removed(id) {\n console.log(id);\n section.controls = section.controls.filter((x) => x.id !== id);\n form.reset();\n }\n\n // function deleteAll() {\n // if (!window.confirm(\"Delete all?\")) return;\n // section.controls = [];\n // form.reset();\n // }\n\n function activateAll() {\n section.controls.forEach((item) => {\n item.find(\"itemStatus\").value = 0;\n });\n form.reset();\n }\n\n function deactivateAll() {\n section.controls.forEach((item) => {\n item.find(\"itemStatus\").value = 99;\n });\n form.reset();\n }\n\n function addItem(e) {\n console.log(e.target.value);\n const itemTypeCode = e.target.value;\n let itemValue = \"\";\n if (itemTypeCode === \"video\") {\n itemValue = JSON.stringify({\n videoUrl: \"\",\n title: \"\",\n desc: \"\",\n posterImage: \"\",\n });\n } else if (itemTypeCode === \"qa\") {\n itemValue = JSON.stringify({ question: \"\", answer: \"\" });\n } else if (itemTypeCode === \"spec\") {\n itemValue = JSON.stringify({ category: \"L\", label: \"\", text: \"\" });\n } else if (itemTypeCode === \"link\") {\n itemValue = JSON.stringify({ linkType: \"auto\", title: \"\", url: \"\" });\n } else if (itemTypeCode === \"weblink\") {\n itemValue = JSON.stringify({ linkType: \"auto\", title: \"\", url: \"\" });\n }\n\n const group = createGroup({\n itemTypeCode: itemTypeCode,\n itemValue: itemValue,\n itemStatus: 0,\n });\n console.log(group);\n section.controls.push(group);\n form.reset();\n console.log(form);\n }\n\n return (\n {render(\"relatedProducts\")}
\n \n
\n \n \n
\n {data.migRelatedProducts.join(\"\\n\")}\n \n \n \n {(provided, snapshot) => (\n \n {section.controls.map((item, index) => (\n \n {(provided, snapshot) => (\n \n
\n )}\n \n ))}\n {provided.placeholder}\n \n )}\n \n \n\n \n For all items in this section,\n \n \n {/* */}\n {addOptions && (\n \n \n \n )}\n
\n {/* {section.controls.map(item => \n
\n );\n}\n\nfunction Item({ form, item }) {\n const render = (name) => form.renderControl(name, item);\n const itemTypeCode = item.find(\"itemTypeCode\").value; // form.findControl('itemTypeCode', item);\n //console.log(item, itemTypeCode)\n if (itemTypeCode === \"video\") {\n return (\n \n
\n \n
\n \n {itemStatus === 99 ? (\n toggleItem()} />\n ) : (\n toggleItem()} />\n )}\n
\n \n removeItem()} />\n
\n \n {/* {item.id} */}\n
\n \n
\n );\n }\n if (itemTypeCode === \"qa\") {\n return (\n \n
\n {render(\"videoUrl\")}
\n {render(\"title\")}
\n {render(\"desc\")}
\n \n
\n );\n }\n if (itemTypeCode === \"spec\") {\n // \"{\"category\": \"L\",\"label\":\"Barrel / Plate size:\",\"text\":\"19mm Barrel\"}\"\n return (\n {render(\"question\")}
\n {render(\"answer\")}
\n \n
\n );\n }\n if (itemTypeCode === \"link\") {\n return (\n {render(\"category\")}
\n {render(\"label\")}
\n {render(\"text\")}
\n \n
\n );\n }\n if (itemTypeCode === \"weblink\") {\n return (\n {render(\"linkType\")}
\n {render(\"title\")}
\n {render(\"url\")}
\n \n
\n );\n }\n return <>{render(\"html\")};\n}\n\nfunction PhotoTab({ form, data }) {\n return (\n <>\n {render(\"title\")}
\n {render(\"url\")}
\n \n
\n );\n}\n\n// function Youtube({ form }) {\n// const section = form.findControl('youtubeSection');\n// const addOptions = [\n// { name: 'Video', itemTypeCode: 'video' }\n// ]\n// return \n {render(\"mpn\")}\n {render(\"mfTitle\")}\n {render(\"mfDesc\")}\n
\n \n {render(\"mfProductType1\")}\n {render(\"mfProductType2\")}\n {render(\"mfProductType3\")}\n {render(\"mfProductType4\")}\n {render(\"mfProductType5\")}\n
\n {/* \n \n More info(Google)\n \n
\n \n
*/}\n \n
\n {data.migRelatedProducts.join('\\n')}\n Loading...
\n } else if (get.hasErrors()) {\n return \n \n \n
\n );\n}\n","import React from 'react';\nimport { getProductEditModel } from './productEditFormModel';\nimport { ProductEditForm } from './productEditForm';\n\nexport function ProductNew(props) {\n const model = getProductEditModel({});\n console.log(model)\n\n return New Product
\n\n\n
\n {render('productCode')}
\n {render('productStatus')}
\n {render('category')}
\n \n
\n\n {render('productName')}
\n \n
\n \n
\n \n \n {JSON.stringify(\n {\n pageIndex,\n pageSize,\n pageCount,\n canNextPage,\n canPreviousPage,\n },\n null,\n 2\n )}\n \n */}\n | \n {column.render('Header')}\n \n {column.isSorted\n ? column.isSortedDesc\n ? ' 🔽'\n : ' 🔼'\n : ''}\n \n | \n ))}\n
|---|
| {cell.render('Cell')} | \n })}\n
\n {loading ? (\n Loading...\n ) : (\n \n Showing {page.length} of ~{contolledTotalCount}{' '}\n results\n \n )}\n
\n\n \n {' '}\n {' '}\n {' '}\n {' '}\n \n Page{' '}\n \n {pageIndex + 1} of {pageOptions.length}\n {' '}\n \n \n | Go to page:{' '}\n {\n const page = e.target.value ? Number(e.target.value) - 1 : 0\n gotoPage(page)\n }}\n style={{ width: '100px' }}\n />\n {' '}\n {\n setPageSize(Number(e.target.value))\n }}\n >\n {[10, 20, 30, 40, 50].map(pageSize => (\n \n ))}\n \n
\n \n )\n}\n","import React from \"react\";\nimport env from \"env\";\nimport { Table } from \"components/table/tableServerSide\";\nimport { usePost } from \"components\";\nimport { SiteLink } from \"components\";\nimport { Loading, ErrorPopup } from \"components\";\nimport { Button, ErrorMessage } from \"components\";\n\nexport function WarrantyList(props) {\n const columns = React.useMemo(\n () => [\n {\n Header: \"First Name\",\n accessor: \"firstName\",\n Cell: (c) => {\n //console.log(c)\n return (\n Warranty Registrations
\n\n
\n\n \n {/* */}\n {/* */}\n \n \n Reset filter\n \n
\n \n Date Registered: \n -\n \n
\n \n
\n \n );\n}\n\nfunction ExportCSV({ getSearchParam }) {\n const post = usePost();\n\n function exportCSV() {\n post.send(env.apiBase + \"/api/warrantyAdmin/exportToCSV\", getSearchParam());\n }\n return (\n Loading...
;\n } else if (get.hasErrors()) {\n return \n
\n \n );\n}\n\nfunction Fld({ name, value }) {\n return (\n Warranty Registration
\n\n < Back to list \n
\n \n Attachments { get; set; } */}\n
\n \n
public List\n
\n
\n \n
\n\n Receipts:
\n \n {data.fileAttachments &&\n data.fileAttachments.map((file, index) => (\n
\n \n \n {file.fileName}\n \n
\n ))}\n \n
Mailchimp integration
\n\n\n
\n );\n}\n\nfunction ResendMailchimp({ id }) {\n const post = usePost();\n\n function resend(e) {\n post.send(env.apiBase + \"/api/warrantyAdmin/resendMc\", { warrantyRegistrationId: id });\n }\n\n if (post.done()) {\n return window.location.reload();\n }\n\n return (\n {name}:
\n \n {value}\n
\n \n \n
\n );\n}\n","import React from \"react\";\nimport env from \"env\";\nimport { Table } from \"components/table/table\";\nimport { useRouter } from \"components\";\nimport { useGet } from \"components\";\nimport { SiteLink } from \"components\";\nimport { Loading, ErrorPopup } from \"components\";\n\nexport function StoreList(props) {\n const columns = React.useMemo(\n () => [\n {\n Header: \"Name\",\n accessor: \"storeName\",\n Cell: (c) => {\n //console.log(c.row)\n return (\n {country === \"AU\" ? \"Australia\" : \"New Zealand\"} Stores
\n\n \n Add {country === \"AU\" ? \"Australia\" : \"New Zealand\"} Store\n \n
\n Loading...
;\n } else if (get.hasErrors()) {\n return \n \n
\n\n
\n \n
\n );\n}\n","import { fb, validators } from \"form\";\n\nexport function getStoreEditModel(data) {\n const model = fb.group({\n storeCode: [data.storeCode || \"\", [validators.Required()], { type: \"text\" }],\n orgStoreCode: [data.storeCode || \"\", [], { type: \"hidden\" }],\n //storeStatus: [data.storeStatus, [validators.Required()], { type: 'select', options: statusList }],\n //country: [data.country || '', [validators.Required()], { type: 'text' }],\n storeName: [data.storeName || \"\", [validators.Required()], { type: \"text\" }],\n storeUrl: [data.storeUrl || \"\", [validators.Required()], { type: \"text\" }],\n buyOnline: [data.buyOnline, [], { label: \"Buy Online\", type: \"checkbox\" }],\n seq: [data.seq || \"0\", [], { type: \"number\", helpText: \"Will automatically re-numbered\" }],\n\n iconPath: [data.iconPath || \"\", [], { type: \"text\" }],\n mailchimpName: [data.mailchimpName || \"\", [], { type: \"text\", helpText: \"For matching field with MailChimp. Check the code first in MailChimp\" }],\n });\n\n return model;\n}\n","import React from 'react';\nimport env from 'env';\nimport { useRouter } from 'components';\nimport { getStoreEditModel } from './storeEditFormModel';\nimport { Link, Redirect } from \"react-router-dom\";\nimport { usePost } from 'components';\nimport { useForm } from 'form';\nimport { Button, ErrorMessage } from 'components';\n\nexport function StoreNew(props) {\n const { query } = useRouter();\n const country = query.country || 'AU';\n const model = getStoreEditModel({ country: country });\n console.log(model)\n\n return Store Edit
\n\n\n
\n {render(\"storeName\")}
\n {render(\"storeCode\")}
\n \n\n
\n
\n\n {render(\"buyOnline\")}
\n \n
\n {render(\"seq\")}
\n {render(\"storeUrl\")}
\n \n
\n
\n\n {render(\"iconPath\")}
\n {render(\"mailchimpName\")}
\n \n
\n \n
\n \n \n \n
\n );\n}","import { fb, validators } from 'form';\n\nexport function getStoreEditModel(data) {\n const model = fb.group({\n storeName: [data.storeName || '', [validators.Required()], { type: 'text' }],\n })\n\n return model;\n}\n","import format from 'date-fns/format';\r\n\r\nimport { toDateTime } from './date';\r\n\r\n// import { formatDateTime } from 'lib/utils-core/dateExt'\r\n// formatDateTime(c.cell.value, 'yyyy-MM-dd HH:mm')\r\nexport function formatDateTime(date, formatStr) {\r\n const dateObj = toDateTime(date);\r\n //console.log(dateObj)\r\n if (!dateObj) return '';\r\n return format(dateObj, formatStr)\r\n}","import React from 'react';\nimport env from 'env';\nimport { Table } from 'components/table/table';\nimport { useGet } from 'components';\nimport { SiteLink } from 'components';\nimport { Loading, ErrorPopup } from 'components';\nimport { formatDateTime } from 'lib/utils-core/dateExt'\n\nexport function ContactList(props) {\n const columns = React.useMemo(\n () => [\n {\n Header: 'Name',\n accessor: 'name',\n Cell: (c) => {\n //console.log(c)\n return (New Store
\n\n\n
\n {render('storeName')}
\n \n
\n \n
\n Contacts
\n\n
\n \n\n {/* */}\n\n \n \n {filterKeyword && clear filter}\n
\n\n Loading...
\n } else if (get.hasErrors()) {\n return \n
\n\n}\n\n// function Fld({ name, value }) {\n// return {data.name} {formatDateTime(data.dateSent, 'yyyy-MM-dd HH:mm')}
\n\n < Back to list \n
\n\n \n
\n \n \n\n {/*
\n \n//
\n// }\n\nfunction ChangeStatus({ id, status }) {\n\n const post = usePost();\n\n function changeStatus(e) {\n post.send(env.apiBase + \"/api/contactAdmin/changeStatus\", { contactId: id, contactStatus: status });\n }\n\n if (post.done()) {\n return {name}:
\n// {value}
\n// \n\n \n
\n}","import React from 'react';\nimport env from 'env';\nimport { Table } from 'components/table/tableServerSide';\nimport { usePost } from 'components';\nimport { SiteLink } from 'components';\nimport { Loading, ErrorPopup } from 'components';\n//import { Button, ErrorMessage } from 'components';\n\nexport function JoinList(props) {\n const columns = React.useMemo(\n () => [\n {\n Header: 'First Name',\n accessor: 'firstName',\n Cell: (c) => {\n //console.log(c)\n return (Join Registrations
\n\n
\n\n \n\n {/* */}\n\n \n \n Reset filter\n\n\n
\n Date Registered: \n -\n \n
\n\n Loading...
\n } else if (get.hasErrors()) {\n return \n
\n\n}\n\n\nfunction Fld({ name, value }) {\n return Join Registration
\n\n < Back to list \n
\n \n \n
\n \n
\n \n \n
\n
\n \n
\n\n Receipts:
\n \n {data.fileAttachments && data.fileAttachments.map((file, index) =>
\n \n {file.fileName}\n
)}\n \n
Mailchimp integration
\n\n\n
\n}","import React from 'react';\nimport { BrowserRouter as Router, Switch, Route, Redirect } from 'react-router-dom';\n\nimport { ProvideAuth } from 'auth';\n\nimport LoginLayoutRoute from \"layout/loginLayout\";\nimport DashboardLayoutRoute from \"layout/dashboardLayout\";\n\nimport { Login } from 'auth';\nimport { ProductList } from 'site/product/productList';\nimport { ProductEdit } from 'site/product/edit/productEdit';\nimport { ProductNew } from 'site/product/new/productNew';\n\nimport { WarrantyList } from 'site/warranty/warrantyList';\nimport { WarrantyView } from 'site/warranty/warrantyView';\n\nimport { StoreList } from 'site/wheretobuy/storeList';\nimport { StoreEdit } from 'site/wheretobuy/edit/storeEdit';\nimport { StoreNew } from 'site/wheretobuy/new/storeNew';\n\nimport { ContactList } from 'site/contact/contactList';\nimport { ContactView } from 'site/contact/contactView';\n\nimport { JoinList } from 'site/join/joinList';\nimport { JoinView } from 'site/join/joinView';\n\nfunction App() {\n return (\n {name}:
\n {value}
\n