@fullstackunicorn/create-root 1.0.28 → 2.0.0

package/assets/root.fullstackunicorn.dev/frontend/imports/scroll/@use.js

@@ -1,85 +0,0 @@
-import { useRef, useEffect, useCallback } from 'react'
-import { useUrl, useIsBack } from '#@/base/router/@use.js'
-import { scroll } from './scroll.js'
-
-export const usePersistentScroll = () => {
-    const scrollRef = useRef(null)
-    const { path } = useUrl()
-    const [isBack, setIsBack] = useIsBack()
-    const restoreDoneRef = useRef(false)
-    const prevPathRef = useRef(path)
-
-    const onScroll = useCallback(() => {
-        const node = scrollRef.current
-        if (!node) return
-        scroll.setTop(path, node.scrollTop)
-    }, [path])
-
-    useEffect(() => {
-        restoreDoneRef.current = false
-    }, [path])
-
-    useEffect(() => {
-        if (!isBack) return
-        if (!scrollRef.current) return
-        if (restoreDoneRef.current) return
-
-        let frame = 0
-        let observer = null
-
-        const tryRestore = () => {
-            const node = scrollRef.current
-            if (!node) return false
-
-            const top = scroll.getTop(path)
-            const maxScroll = node.scrollHeight - node.clientHeight
-
-            if (maxScroll < top) return false
-
-            node.scrollTop = top
-            restoreDoneRef.current = true
-            setIsBack(false)
-            return true
-        }
-
-        if (tryRestore()) return
-
-        const node = scrollRef.current
-        if (!node) return
-
-        if (typeof ResizeObserver !== 'undefined') {
-            observer = new ResizeObserver(() => {
-                if (restoreDoneRef.current) return
-                if (tryRestore()) observer?.disconnect()
-            })
-            observer.observe(node)
-        }
-
-        const tick = () => {
-            if (restoreDoneRef.current) return
-            if (tryRestore()) return
-            frame = requestAnimationFrame(tick)
-        }
-        frame = requestAnimationFrame(tick)
-
-        return () => {
-            observer?.disconnect()
-            cancelAnimationFrame(frame)
-        }
-
-    }, [isBack, path])
-
-    useEffect(() => {
-        const prevPath = prevPathRef.current
-        prevPathRef.current = path
-
-        if (isBack) return
-        if (prevPath === path) return
-
-        const node = scrollRef.current
-        if (!node) return
-        node.scrollTop = 0
-    }, [path, isBack])
-
-    return { scrollRef, onScroll }
-}

package/assets/root.fullstackunicorn.dev/frontend/imports/scroll/scroll.js

@@ -1,33 +0,0 @@
-// scroll.js
-import { storage } from '#@/imports/storage.js'
-
-class Scroll {
-
-  _read() {
-    return storage.getJSON('scroll') || {}
-  }
-
-  _write(data) {
-    storage.setJSON('scroll', data)
-  }
-
-  getTop(path) {
-    const data = this._read()
-    const v = data[path]
-    return typeof v === 'number' ? v : 0
-  }
-
-  setTop(path, value) {
-    const data = this._read()
-    data[path] = value ?? 0
-    this._write(data)
-  }
-
-  restore(path, scrollRef) {
-    const top = this.getTop(path)
-    if (scrollRef?.current) scrollRef.current.scrollTop = top
-    return top
-  }
-}
-
-export const scroll = new Scroll()

package/assets/root.fullstackunicorn.dev/frontend/imports/service.js

@@ -1,27 +0,0 @@
-import { cache } from '#@/imports/cache'
-
-class Service {
-
-    constructor() {
-        this.cachePreload = 'cache-preload'
-    }
-
-    todayUTC = () => new Date().toISOString().slice(0, 10)
-
-    setPreload = async key => {
-        const store = await cache.open(this.cachePreload)
-        const request = new Request(key)
-        const response = new Response(this.todayUTC(), { headers: { 'Content-Type': 'text/plain' } })
-        await store.put(request, response)
-    }
-
-    isPreload = async key => {
-        const store = await cache.open(this.cachePreload)
-        const response = await store.match(key)
-        if (!response) return true
-        const lastDay = (await response.text()).trim()
-        return lastDay < this.todayUTC()
-    }
-}
-
-export const service = new Service()

package/assets/root.fullstackunicorn.dev/frontend/imports/storage.js

@@ -1,48 +0,0 @@
-const normalize = value => {
-    if (value === 'false') return false
-    if (value === 'true') return true
-    return value
-}
-
-export const storage = {
-
-    getJSON: (key) => {
-        const value = localStorage.getItem(key)
-        return value ? JSON.parse(value) : {}
-    },
-
-    setJSON: (key, value={}) => {
-        localStorage.setItem(key, JSON.stringify(value))
-        return value
-    },
-
-    initJSON: (key, value={}) => {
-        const item = localStorage.getItem(key)
-        const itemParsed = JSON.parse(item) || {}
-        if (F3.obj.isGood(itemParsed)) return itemParsed
-        localStorage.setItem(key, JSON.stringify(value))
-        return value
-    },
-
-    get: (key) => {
-        const value = localStorage.getItem(key)
-        return normalize(value)
-    },
-
-    set: (key, value) => {
-        localStorage.setItem(key, value)
-        return value
-    },
-
-    init: (key, value) => {
-        const item = localStorage.getItem(key)
-        if (item) return normalize(item)
-        localStorage.setItem(key, value)
-        return value
-    },
-
-    remove: (key) => {
-        localStorage.removeItem(key)
-        return true
-    }
-}

package/assets/root.fullstackunicorn.dev/frontend/imports/use.js

@@ -1,62 +0,0 @@
-import { useState, useEffect, useRef } from 'react'
-import { constants } from '#@/root/constants.js'
-
-export const useDefaultLanguage = () => 'en-US'
-
-export const useIsDefaultThemeDark = () => {
-    if (constants.services.IS_CARD_THEME_OFF) return false
-    if (constants.services.IS_DEFAULT_THEME_DARK) return true
-    else return false
-}
-
-export const useWindowDimensions = () => {
-    const [windowDimensions, setWindowDimensions] = useState({
-        width: window.innerWidth,
-        height: window.innerHeight,
-    })
-    useEffect(() => {
-        const handleResize = () => {
-            setWindowDimensions({
-                width: window.innerWidth,
-                height: window.innerHeight,
-            })
-        }
-        window.addEventListener('resize', handleResize)
-        return () => window.removeEventListener('resize', handleResize)
-    }, [])
-
-    return windowDimensions
-}
-
-export const useContainerSize = () => {
-
-    const viewRef = useRef(null)
-
-    const [size, setSize] = useState({
-        width: 0,
-        height: 0,
-    })
-
-    useEffect(() => {
-        if (!viewRef.current) return
-
-        const handleResize = () => {
-            const width = viewRef.current?.offsetWidth || 0
-            const height = viewRef.current?.offsetHeight || 0
-            setSize({ width, height })
-        }
-
-        handleResize()
-
-        const observer = new ResizeObserver(handleResize)
-        observer.observe(viewRef.current)
-
-        return () => observer.disconnect()
-    }, [])
-
-    return {
-        viewRef,
-        width: size.width,
-        height: size.height,
-    }
-}

package/assets/root.fullstackunicorn.dev/frontend/index.html

@@ -1,36 +0,0 @@
-<!DOCTYPE html>
-
-<!-- {{language}} -->
-
-<head>
-
-    <meta charset="UTF-8" />
-    <meta name="author" content="lucanigido" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
-    <meta http-equiv="Pragma" content="no-cache">
-    <meta http-equiv="Expires" content="0">
-
-    <meta content="#ffffff" name="msapplication-TileColor" />
-    <meta content="/get/media/icons/icon-512.png" name="msapplication-TileImage" />
-    <meta content="Carlo" name="apple-mobile-web-app-title" />
-    <link href="/get/media/icons/icon-180.png" rel="apple-touch-icon" sizes="180x180" />
-    <link href="/index.webmanifest" rel="manifest" />
-    
-    <link href="/get/media/icons/favicon.ico" rel="shortcut icon" />
-    <link href="/get/media/icons/favicon.png" rel="icon" type="image/png" />
-    
-    <!-- {{metadata}} -->
-    <!-- {{languages}} -->
-    <!-- {{opengraph}} -->
-    <!-- {{twitter}} -->
-    <!-- {{schema}} -->
-
-</head>
-
-<body>
-    <div id="root"></div>
-    <script type="module" src="/App.js"></script>
-</body>
-
-</html>

package/assets/root.fullstackunicorn.dev/frontend/jsconfig.json

@@ -1,18 +0,0 @@
-{
-  "compilerOptions": {
-    "paths": {
-      "#@": ["./"],
-      "#@/*": ["./*"]
-    }
-  },
-  "include": [
-    "src/**/*",
-    "imports/**/*",
-    "**/*.js",
-    "**/*.jsx"
-  ],
-  "exclude": [
-    "node_modules",
-    "dist"
-  ]
-}

package/assets/root.fullstackunicorn.dev/frontend/menus/@use.js

@@ -1,15 +0,0 @@
-import { useState, useEffect } from 'react'
-import { useUrl } from '#@/base/router/@use.js'
-
-export const useApi= (func, path) => {
-    const { lang } = useUrl()
-    const [result, setResult] = useState()
-    useEffect(() => {
-        const load = async () => {
-            const response = await func({ lang, path })
-            setResult(response?.data)
-        }
-        load()
-    }, [lang])
-    return result
-}

package/assets/root.fullstackunicorn.dev/frontend/menus/Main.js

@@ -1,33 +0,0 @@
-import { useUrl } from '#@/base/router/@use.js'
-import { routes } from '#@/root/routes.js'
-import { MenuBoxTwo, MenuLinkTwo } from '#@/base/layout/menus/MenuTwo.js'
-import { useGetMenus } from '#@/base/layout/menus/@use.js'
-
-export const Main = ({ isTwo }) => {
-
-    const menus = useGetMenus()
-
-    const { lang, isUrl } = useUrl()
-    const verbal = menus?.main?.verbal || {}
-
-    if (!F3.obj.isGood(menus)) return null
-    return (
-        <MenuBoxTwo>
-            {Object.keys(routes.public).map(key => {
-
-                if (!routes.public[key].isMenu) return null
-                let link = F3.fabUrl(routes.public[key].path, { lang })
-
-                return (
-                    <MenuLinkTwo
-                        isFlip={isTwo}
-                        key={routes.public[key].path}
-                        isActive={isUrl(link)}
-                        linkTo={link}
-                        text={verbal[key] || routes.public[key].id || key}
-                    />
-                )
-            })}
-        </MenuBoxTwo>
-    )
-}

package/assets/root.fullstackunicorn.dev/frontend/menus/Main.use.js

@@ -1,22 +0,0 @@
-import { uri } from '#@/App.uri.js'
-import { useSetMenus } from '#@/base/layout/menus/@use.js'
-
-export const useLoadMainMenu = (lang) => {
-
-    const setMenus = useSetMenus()
-
-    const loadMainMenu = (data) => {
-
-        const paths = {}
-        paths.verbal = F3.fabUrl(uri.data.menus.verbal, { lang, path:'main' })
-        paths.logic = F3.fabUrl(uri.data.menus.logic, { path:'main' })
-
-        const menus = {}
-        menus.main = {}
-        menus.main.verbal = F3.obj.get(data[0], `data.items.${paths.verbal}.data.@data.routes.items`) || {}
-        menus.main.logic = F3.obj.get(data[0], `data.items.${paths.logic}.data.@data.routes.items`) || []
-        
-        setMenus(menus)
-    }
-    return loadMainMenu
-}

package/assets/root.fullstackunicorn.dev/frontend/modals/cookies/cookies.api.js

@@ -1,25 +0,0 @@
-import { useGetStatics } from '#@/base/statics/@use.js'
-import { useGetLookups } from '#@/base/lookups/@use.js'
-
-export const useCookiesData = () => {
-
-    const statics = useGetStatics()
-    const lookups = useGetLookups()
-
-    const itemVisual = {}
-    for (const key of Object.keys(statics.logic.cookies.data)) {
-        itemVisual[key] = { svg: statics.visual.svg.cookies }
-    }
-
-    return {
-        svg: statics.visual.svg.cookies,
-        itemLogic: statics.logic.cookies,
-        itemVisual,
-        itemVerbal: {
-            title: lookups.cookies.verbal.modal.title,
-            description: lookups.cookies.verbal.modal.description,
-            action: lookups.cookies.verbal.modal.action,
-            data: lookups.cookies.verbal.data
-        }
-    }
-}

package/assets/root.fullstackunicorn.dev/frontend/modals/cookies/cookies.js

@@ -1,88 +0,0 @@
-import { useRef } from 'react'
-import { storage } from '#@/imports/storage.js'
-import { api } from '#@/client/@api.js'
-import { constants } from '#@/root/constants.js'
-import { tools } from '#@/base/cookies/@tools.js'
-import { useGetStatics } from '#@/base/statics/@use.js'
-import { useModalClose } from '#@/base/modals/@use.js'
-import { useCookies, useGetConsent, useSetCookies, useSetConsent, useGetAgreement } from '#@/base/cookies/@use.js'
-import { useSetAlerts } from '#@/base/alerts/@use.js'
-import { Modal } from '#@/base/modals/Modal.js'
-import { SliderPage } from '#@/modules/modals/slider/SliderPage.js'
-import { Actions } from '#@/modules/modals/slider/Actions.js'
-import { TextButton } from '#@/modules/buttons/TextButton.js'
-import { useCookiesData } from '#@/modals/cookies/cookies.api.js'
-
-const CookiesModal = ({ id }) => {
-
-    const data = useCookiesData()
-    const statics = useGetStatics()
-    const consent = useGetConsent()
-    const [cookieValues] = useCookies()
-    const setAlerts = useSetAlerts()
-    const setCookies = useSetCookies()
-    const setConsent = useSetConsent()
-    const modalClose = useModalClose()
-    const getAgreement = useGetAgreement()
-
-    const formResult = useRef({})
-    formResult.current = cookieValues
-
-    const isCloseDisabled = !consent
-    const isLanguageButton = !constants.services.IS_CARD_LANGUAGE_OFF
-
-    const onSetValue = async () => {
-
-        const device = storage.get('device')
-        const agreement = getAgreement({
-            agreement_type: statics.logic.cookies.type,
-            agreement_version: statics.logic.cookies.version,
-            agreement_subject_id: device,
-            agreement_subject_type: 'device_id',
-            agreement_agreed: formResult.current,
-        })
-
-        const agreements = { [statics.logic.cookies.type]: agreement }
-        const submit = await tools.getSubmit(device)
-        const consentPayload = [{ agreements, submit }]
-        const response = await api.cookies.set(consentPayload)
-
-        if (response.isOffline) setAlerts({ id: 'offline' })
-        else if (response.isError) setAlerts({ id: 'error-cookies-set' })
-        else if (response.isValid) {
-            setCookies(response.data)
-            setConsent(response.consent_id)
-            void api.cookies.get()
-        }
-        modalClose(id)
-    }
-
-    return (
-        <Modal
-            id={id}
-            isCloseDisabled={isCloseDisabled}
-            title={data.itemVerbal.title}
-            svg={data.svg}
-            actions={
-                <Actions isLanguageButton={isLanguageButton}>
-                    <TextButton
-                        text={data.itemVerbal.action}
-                        type='fill'
-                        color='C1'
-                        onPress={onSetValue}
-                    />
-                </Actions>
-            }
-        >
-            <SliderPage
-                formResult={formResult}
-                sliderLogic={data.itemLogic}
-                sliderVerbal={data.itemVerbal.data}
-                sliderVisual={data.itemVisual}
-                description={data.itemVerbal.description}
-            />
-        </Modal>
-    )
-}
-
-export const cookies = (modal={}) => <CookiesModal key={modal.id} {...modal}/>

package/assets/root.fullstackunicorn.dev/frontend/modals/countries/countries.api.js

@@ -1,22 +0,0 @@
-import { uri } from '#@/App.uri.js'
-import { api } from '#@/client/@api.js'
-import { useUrl } from '#@/base/router/@use.js'
-import { useLoad } from '#@/pages/@use.js'
-
-const path = 'countries'
-
-const fetch = async params => {
-    const verbal = await api.statics.get(uri.lookups.verbal, params)
-    const visual = await api.statics.get(uri.lookups.visual, params)
-    return {
-        data: {
-            verbal: verbal.data['@data'],
-            visual: visual.data
-        }
-    }
-}
-
-export const useApiCountries = () => {
-    const { lang } = useUrl()
-    return useLoad(fetch, lang, path)
-}

package/assets/root.fullstackunicorn.dev/frontend/modals/countries/countries.js

@@ -1,60 +0,0 @@
-import { useState } from 'react'
-import { useGetStatics } from '#@/base/statics/@use.js'
-import { useModalClose } from '#@/base/modals/@use.js'
-import { Modal } from '#@/base/modals/Modal.js'
-import { SelectPage } from '#@/modules/modals/select/SelectPage.js'
-import { Actions } from '#@/modules/modals/select/Actions.js'
-import { useApiCountries } from '#@/modals/countries/countries.api.js'
-
-const CountriesModal = ({ id, data = {} }) => {
-
-    const { onSetValue, current } = data
-
-    const api = useApiCountries()
-
-    const statics = useGetStatics()
-    const modalClose = useModalClose()
-
-    const [value, setValue] = useState(current)
-
-    if (!api) return null
-
-    const itemLogic = { options: Object.keys(api.verbal.data.items) }
-    const itemVerbal = { options: api.verbal.data.items, title: api.verbal.views.modal.title }
-    const itemVisual = { options: api.visual }
-
-    const isDisabled = value?.slug === current?.slug
-
-    const onSave = async () => {
-        if (onSetValue) await onSetValue(value)
-        modalClose(id)
-    }
-
-    const onRestore = () => setValue(current)
-
-    return (
-        <Modal
-            id={id}
-            title={itemVerbal.title}
-            svg={statics.visual.svg.edit}
-            actions={
-                <Actions
-                    selected={value}
-                    onSave={onSave}
-                    onRestore={onRestore}
-                    isDisabled={isDisabled}
-                />
-            }
-        >
-            <SelectPage
-                itemLogic={itemLogic}
-                itemVerbal={itemVerbal}
-                itemVisual={itemVisual}
-                selected={value}
-                setValue={setValue}
-            />
-        </Modal>
-    )
-}
-
-export const countries = (modal={}) => <CountriesModal key={modal.id} {...modal}/>

package/assets/root.fullstackunicorn.dev/frontend/modals/languages/languages.api.js

@@ -1,23 +0,0 @@
-import { tools } from '#@/base/language/@tools.js'
-import { useGetStatics } from '#@/base/statics/@use.js'
-import { useGetLookups } from '#@/base/lookups/@use.js'
-import { useGetLanguage } from '#@/base/language/@use.js'
-
-export const useLanguagesData = () => {
-
-    const statics = useGetStatics()
-    const lookups = useGetLookups()
-    const language = useGetLanguage()
-
-    const langs = [statics.logic['@lang'], ...F3.arr.safe(statics.logic['@langs'])]
-    const label = tools.getLanguageLabel(lookups, language.slug)
-
-    return {
-        current: { slug: language.slug, value: label },
-        itemLogic: { options: langs },
-        itemVerbal: {
-            options: tools.getLanguages(lookups, langs),
-            title: lookups.languages.verbal.views.modal.title
-        }
-    }
-}