hfs 0.26.8 → 0.26.9

package/admin/src/VfsPage.ts

@@ -1,124 +0,0 @@
-// This file is part of HFS - Copyright 2021-2022, Massimo Melina <a@rejetto.com> - License https://www.gnu.org/licenses/gpl-3.0.txt
-
-import { createElement as h, useEffect, useMemo, useState } from 'react'
-import { useApi, useApiEx } from './api'
-import { Alert, Grid, Link, List, ListItem, ListItemText, Typography } from '@mui/material'
-import { state, useSnapState } from './state'
-import VfsMenuBar from './VfsMenuBar'
-import VfsTree from './VfsTree'
-import { onlyTruthy, prefix } from './misc'
-import { reactJoin } from '@hfs/shared'
-import _ from 'lodash'
-import { AlertProps } from '@mui/material/Alert/Alert'
-import FileForm from './FileForm'
-
-let selectOnReload: string[] | undefined
-
-export default function VfsPage() {
-    const [id2node] = useState(() => new Map<string, VfsNode>())
-    const snap = useSnapState()
-    const { data, reload, element } = useApiEx('get_vfs')
-    useMemo(() => snap.vfs || reload(), [snap.vfs, reload])
-    useEffect(() => {
-        state.vfs = undefined
-        if (!data) return
-        // rebuild id2node
-        id2node.clear()
-        const { root } = data
-        if (!root) return
-        recur(root) // this must be done before state change that would cause Tree to render and expecting id2node
-        root.isRoot = true
-        state.vfs = root
-        // refresh objects of selectedFiles
-        const ids = selectOnReload || state.selectedFiles.map(x => x.id)
-        selectOnReload = undefined
-        state.selectedFiles = onlyTruthy(ids.map(id =>
-            id2node.get(id)))
-
-        // calculate id and parent fields, and builds the map id2node
-        function recur(node: VfsNode, pre='', parent: VfsNode|undefined=undefined) {
-            node.parent = parent
-            node.id = prefix(pre, node.name) || '/' // root
-            id2node.set(node.id, node)
-            if (!node.children) return
-            for (const n of node.children)
-                recur(n, (pre && node.id) + '/', node)
-        }
-
-    }, [data, id2node])
-    const [status] = useApi(window.location.host === 'localhost' && 'get_status')
-    const urls = useMemo(() =>
-        typeof status === 'object'
-            && _.sortBy(
-                onlyTruthy(Object.values(status.urls?.https || status.urls?.http || {}).map(u => typeof u === 'string' && u)),
-                url => url.includes('[')
-            ),
-        [status])
-    if (element) {
-        id2node.clear()
-        return element
-    }
-    const anythingShared = !data?.root?.children?.length && !data?.root?.source
-    const alert: AlertProps | false = anythingShared ? {
-        severity: 'warning',
-        children: "Add something to your shared files — click Add"
-    } : urls && {
-        severity: 'info',
-        children: [
-            "Your shared files can be browsed from ",
-            reactJoin(" or ", urls.slice(0,3).map(href => h(Link, { href }, href)))
-        ]
-    }
-    return h(Grid, { container:true, rowSpacing: 1, maxWidth: '80em', columnSpacing: 2 },
-        alert && h(Grid, { item: true, mb: 2, xs: 12 }, h(Alert, alert)),
-        h(Grid, { item:true, sm: 6, lg: 5 },
-            h(Typography, { variant: 'h6', mb:1, }, "Virtual File System"),
-            h(VfsMenuBar),
-            snap.vfs && h(VfsTree, { id2node })),
-        h(Grid, { item:true, sm: 6, lg: 7, maxWidth:'100%' },
-            h(SidePanel))
-    )
-}
-
-function SidePanel() {
-    const { selectedFiles: files } = useSnapState()
-    return files.length === 0 ? null
-        : files.length === 1 ? h(FileForm, { file: files[0] as VfsNode }) // it's actually Snapshot<VfsNode> but it's easier this way
-            : h(List, {},
-                files.length + ' selected',
-                files.map(f => h(ListItem, { key: f.name },
-                    h(ListItemText, { primary: f.name, secondary: f.source }) )))
-}
-
-export function reloadVfs(pleaseSelect?: string[]) {
-    selectOnReload = pleaseSelect
-    state.vfs = undefined
-}
-
-export type VfsNode = {
-    id: string
-    name: string
-    type?: 'folder'
-    source?: string
-    size?: number
-    ctime?: string
-    mtime?: string
-    default?: string
-    children?: VfsNode[]
-    parent?: VfsNode
-    can_see: Who
-    can_read: Who
-    website?: true
-    masks?: any
-
-    isRoot?: true
-}
-
-const WHO_ANYONE = true
-const WHO_NO_ONE = false
-const WHO_ANY_ACCOUNT = '*'
-type AccountList = string[]
-export type Who = typeof WHO_ANYONE
-    | typeof WHO_NO_ONE
-    | typeof WHO_ANY_ACCOUNT
-    | AccountList

package/admin/src/VfsTree.ts

@@ -1,95 +0,0 @@
-// This file is part of HFS - Copyright 2021-2022, Massimo Melina <a@rejetto.com> - License https://www.gnu.org/licenses/gpl-3.0.txt
-
-import { state, useSnapState } from './state'
-import { createElement as h, ReactElement, useState } from 'react'
-import { TreeItem, TreeView } from '@mui/lab'
-import {
-    ChevronRight,
-    ExpandMore,
-    TheaterComedy,
-    Folder,
-    Home,
-    InsertDriveFileOutlined,
-    Lock,
-    RemoveRedEye,
-    Web
-} from '@mui/icons-material'
-import { Box } from '@mui/material'
-import { VfsNode, Who } from './VfsPage'
-import { iconTooltip, isWindowsDrive, onlyTruthy } from './misc'
-
-export const FolderIcon = Folder
-export const FileIcon = InsertDriveFileOutlined
-
-export default function VfsTree({ id2node }:{ id2node: Map<string, VfsNode> }) {
-    const { vfs, selectedFiles } = useSnapState()
-    const [selected, setSelected] = useState<string[]>(selectedFiles.map(x => x.id)) // try to restore selection after reload
-    const [expanded, setExpanded] = useState(Array.from(id2node.keys()))
-    if (!vfs)
-        return null
-    return h(TreeView, {
-        expanded,
-        selected,
-        multiSelect: true,
-        sx: { overflowX: 'auto' },
-        onNodeSelect(ev, ids) {
-            setSelected(ids)
-            state.selectedFiles = onlyTruthy(ids.map(id => id2node.get(id)))
-        }
-    }, recur(vfs as Readonly<VfsNode>))
-
-    function isRestricted(who: Who) {
-        return who !== undefined && who !== true
-    }
-
-    function recur(node: Readonly<VfsNode>): ReactElement {
-        let { id, name, source, isRoot } = node
-        if (!id)
-            debugger
-        const folder = node.type === 'folder'
-        if (folder && !isWindowsDrive(source) && source === name) // we need a way to show that the name we are displaying is a source in this ambiguous case, so we add a redundant ./
-            source = './' + source
-        return h(TreeItem, {
-            label: h(Box, {
-                sx: {
-                    display: 'flex',
-                    gap: '.5em',
-                    lineHeight: '2em',
-                    alignItems: 'center',
-                }
-            },
-                isRoot ? iconTooltip(Home, "home, or root if you like")
-                    : folder ? iconTooltip(FolderIcon, "Folder")
-                        : iconTooltip(FileIcon, "File"),
-                isRestricted(node.can_see) && iconTooltip(RemoveRedEye, "Restrictions on who can see"),
-                isRestricted(node.can_read) && iconTooltip(Lock, "Restrictions on who can download"),
-                node.default && iconTooltip(Web, "Act as website"),
-                node.masks && iconTooltip(TheaterComedy, "Masks"),
-                isRoot ? "Home"
-                    // special rendering if the whole source is not too long, and the name was not customized
-                    : source?.length! < 45 && source?.endsWith(name) ? h('span', {},
-                        h('span', { style: { opacity: .4 } }, source.slice(0,-name.length)),
-                        h('span', {}, source.slice(-name.length)),
-                    )
-                    : name
-            ),
-            key: name,
-            collapseIcon: h(ExpandMore, {
-                onClick(ev) {
-                    setExpanded( expanded.filter(x => x !== id) )
-                    ev.preventDefault()
-                    ev.stopPropagation()
-                }
-            }),
-            expandIcon: h(ChevronRight, {
-                onClick(ev) {
-                    setExpanded( [...expanded, id] )
-                    ev.preventDefault()
-                    ev.stopPropagation()
-                }
-            }),
-            nodeId: id
-        }, isRoot && !node.children?.length ? h('i', {}, "nothing here") : node.children?.map(recur))
-    }
-
-}

package/admin/src/addFiles.ts

@@ -1,59 +0,0 @@
-// This file is part of HFS - Copyright 2021-2022, Massimo Melina <a@rejetto.com> - License https://www.gnu.org/licenses/gpl-3.0.txt
-
-import { alertDialog, newDialog, promptDialog } from './dialog'
-import { createElement as h, Fragment } from 'react'
-import { Box } from '@mui/material'
-import { VfsNode, reloadVfs } from './VfsPage'
-import { state } from './state'
-import { apiCall } from './api'
-import FilePicker from './FilePicker'
-import { onlyTruthy } from './misc'
-
-export default function addFiles() {
-    const close = newDialog({
-        title: "Add files or folders",
-        dialogProps: { sx:{ minWidth: 'min(90vw, 40em)', minHeight: 'calc(100vh - 9em)' } },
-        Content() {
-            const under = getUnder()
-            return h(Fragment, {},
-                h(Box, { sx:{ typography: 'body1', px: 1, py: 2 } },
-                    "Selected elements will be added to virtual path " + (under || '(home)')),
-                h(FilePicker, {
-                    async onSelect(sel) {
-                        let failed = await Promise.all(sel.map(source =>
-                            apiCall('add_vfs', { under, source }).then(() => '', () => source) ))
-                        failed = onlyTruthy(failed)
-                        if (failed.length)
-                            await alertDialog("Some elements have been rejected: "+failed.join(', '), 'error')
-                        reloadVfs()
-                        close()
-                    }
-                })
-            )
-        }
-    })
-}
-
-export async function addVirtual() {
-    try {
-        const name = await promptDialog("Enter folder name")
-        if (!name) return
-        const under = getUnder()
-        await apiCall('add_vfs', { under, name })
-        reloadVfs([ (under||'') + '/' + name ])
-        await alertDialog(`Folder "${name}" created`, 'success')
-    }
-    catch(e) {
-        await alertDialog(e as Error)
-    }
-}
-
-function getUnder() {
-    let f: VfsNode | undefined = state.selectedFiles[0]
-    if (!f)
-        return ''
-    if (f.type !== 'folder')
-        f = f.parent
-    const { id } = f!
-    return id === '/' ? '' : id
-}

package/admin/src/api.ts

@@ -1,246 +0,0 @@
-// This file is part of HFS - Copyright 2021-2022, Massimo Melina <a@rejetto.com> - License https://www.gnu.org/licenses/gpl-3.0.txt
-
-import { createElement as h, useCallback, useEffect, useMemo, useRef } from 'react'
-import { Dict, err2msg, Falsy, getCookie, IconBtn, spinner, useStateMounted, wantArray } from './misc'
-import { Alert } from '@mui/material'
-import _ from 'lodash'
-import { state } from './state'
-import { Refresh } from '@mui/icons-material'
-import produce, { Draft } from 'immer'
-
-export function useApiEx<T=any>(...args: Parameters<typeof useApi>) {
-    const [data, error, reload] = useApi<T>(...args)
-    const cmd = args[0]
-    const loading = data === undefined
-    const element = useMemo(() =>
-            !cmd ? null
-                : error ? h(Alert, { severity: 'error' }, String(error), h(IconBtn, { icon: Refresh, onClick: reload, sx: { m:'-8px 0 -8px 16px' } }))
-                    : loading ? spinner()
-                        : null,
-        [error, cmd, loading, reload])
-    return { data, error, reload, loading, element }
-}
-
-const PREFIX = '/~/api/'
-
-const timeoutByApi: Dict = {
-    get_status: 20 // can be lengthy on slow machines because of the find-process-on-busy-port feature
-}
-export function apiCall(cmd: string, params?: Dict, { timeout=undefined }={}) : Promise<any> {
-    const csrf = getCsrf()
-    if (csrf)
-        params = { csrf, ...params }
-
-    const controller = new AbortController()
-    if (timeout !== false)
-        setTimeout(() => controller.abort('timeout'), 1000*(timeoutByApi[cmd] ?? timeout ?? 10))
-    return fetch(PREFIX+cmd, {
-        method: 'POST',
-        headers: { 'content-type': 'application/json' },
-        signal: controller.signal,
-        body: params && JSON.stringify(params),
-    }).then(async res => {
-        if (res.ok)
-            return res.json().then(json => {
-                console.debug('API', cmd, params, '>>', json)
-                return json
-            })
-        const msg = await res.text() || 'Failed API ' + cmd
-        console.warn(msg + (params ? ' ' + JSON.stringify(params) : ''))
-        if (res.status === 401)
-            state.loginRequired = true
-        throw new ApiError(res.status, msg)
-    }, err => {
-        if (err?.message?.includes('fetch'))
-            throw Error("Network error")
-        throw err
-    })
-}
-
-export class ApiError extends Error {
-    constructor(readonly code:number, message: string) {
-        super(message);
-    }
-}
-
-export function useApi<T=any>(cmd: string | Falsy, params?: object) : [T | undefined, undefined | Error, ()=>void] {
-    const [ret, setRet] = useStateMounted<T | undefined>(undefined)
-    const [err, setErr] = useStateMounted<Error | undefined>(undefined)
-    const [forcer, setForcer] = useStateMounted(0)
-    const loadingRef = useRef(false)
-    useEffect(()=>{
-        setRet(undefined)
-        setErr(undefined)
-        if (!cmd) return
-        loadingRef.current = true
-        apiCall(cmd, params)
-            .then(setRet, setErr)
-            .finally(()=> loadingRef.current = false)
-    }, [cmd, JSON.stringify(params), forcer]) //eslint-disable-line -- json-ize to detect deep changes
-    const reload = useCallback(()=> loadingRef.current || setForcer(v => v+1), [setForcer])
-    return [ret, err, reload]
-}
-
-type EventHandler = (type:string, data?:any) => void
-
-export function apiEvents(cmd: string, params: Dict, cb:EventHandler) {
-    console.debug('API EVENTS', cmd, params)
-    const csrf = getCsrf()
-    const processed: Record<string,string> = { csrf: csrf && JSON.stringify(csrf) }
-    for (const k in params) {
-        const v = params[k]
-        if (v === undefined) continue
-        processed[k] = JSON.stringify(v)
-    }
-    const source = new EventSource(PREFIX + cmd + '?' + new URLSearchParams(processed))
-    source.onopen = () => cb('connected')
-    source.onerror = err => cb('error', err)
-    source.onmessage = ({ data }) => {
-        if (!data) {
-            cb('closed')
-            return source.close()
-        }
-        try { data = JSON.parse(data) }
-        catch {
-            return cb('string', data)
-        }
-        console.debug('SSE msg', data)
-        cb('msg', data)
-    }
-    return source
-}
-
-function getCsrf() {
-    return getCookie('csrf')
-}
-
-export function useApiEvents(cmd: string, params: Dict={}) {
-    const [data, setData] = useStateMounted<any>(undefined)
-    const [error, setError] = useStateMounted<any>(undefined)
-    const [loading, setLoading] = useStateMounted(false)
-    useEffect(() => {
-        const src = apiEvents(cmd, params, (type, data) => {
-            switch (type) {
-                case 'error':
-                    setError("Connection error")
-                    return stop()
-                case 'closed':
-                    return stop()
-                case 'msg':
-                    if (src?.readyState === src?.CLOSED)
-                        return stop()
-                    return setData(data)
-            }
-        })
-        return () => {
-            src.close()
-            stop()
-        }
-
-        function stop() {
-            setLoading(false)
-        }
-    }, [cmd, JSON.stringify(params)]) //eslint-disable-line
-    return { data, loading, error }
-}
-
-export function useApiList<T=any>(cmd:string|Falsy, params: Dict={}, { addId=false, map=((x:any)=>x) }={}) {
-    const [list, setList] = useStateMounted<T[]>([])
-    const [error, setError] = useStateMounted<any>(undefined)
-    const [connecting, setConnecting] = useStateMounted(true)
-    const [loading, setLoading] = useStateMounted(false)
-    const [initializing, setInitializing] = useStateMounted(true)
-    const idRef = useRef(0)
-    useEffect(() => {
-        if (!cmd) return
-        const buffer: T[] = []
-        const apply = _.debounce(() => {
-            const chunk = buffer.splice(0, Infinity)
-            if (chunk.length)
-                setList(list => [ ...list, ...chunk ])
-        }, 1000, { maxWait: 1000 })
-        setError(undefined)
-        setLoading(true)
-        setConnecting(true)
-        setInitializing(true)
-        setList([])
-        const src = apiEvents(cmd, params, (type, data) => {
-            switch (type) {
-                case 'connected':
-                    setConnecting(false)
-                    return setTimeout(() => apply.flush()) // this trick we'll cause first entries to be rendered almost immediately, while the rest will be subject to normal debouncing
-                case 'error':
-                    setError("Connection error")
-                    return stop()
-                case 'closed':
-                    return stop()
-                case 'msg':
-                    wantArray(data).forEach(data => {
-                        if (data === 'ready') {
-                            apply.flush()
-                            setInitializing(false)
-                            return
-                        }
-                        if (data.error)
-                            return setError(err2msg(data.error))
-                        if (data.add) {
-                            const rec = map(data.add)
-                            if (addId)
-                                rec.id = ++idRef.current
-                            buffer.push(rec)
-                            apply()
-                            return
-                        }
-                        if (data.remove) {
-                            const matchOnList: ReturnType<typeof _.matches>[] = []
-                            // first remove from the buffer
-                            for (const key of data.remove) {
-                                const match1 = _.matches(key)
-                                if (_.isEmpty(_.remove(buffer, match1)))
-                                    matchOnList.push(match1)
-                            }
-                            // then work the hooked state
-                            if (_.isEmpty(matchOnList))
-                                return
-                            setList(list => {
-                                const filtered = list.filter(rec => !matchOnList.some(match1 => match1(rec)))
-                                return filtered.length < list.length ? filtered : list // avoid unnecessary changes
-                            })
-                            return
-                        }
-                        if (data.update) {
-                            apply.flush() // avoid treating buffer
-                            setList(list => {
-                                const modified = [...list]
-                                for (const { search, change } of data.update) {
-                                    const idx = modified.findIndex(_.matches(search))
-                                    if (idx >= 0)
-                                        modified[idx] = { ...modified[idx], ...change }
-                                }
-                                return modified
-                            })
-                            return
-                        }
-                        console.debug('unknown api event', type, data)
-                    })
-                    if (src?.readyState === src?.CLOSED)
-                        stop()
-            }
-        })
-
-        return () => src.close()
-
-        function stop() {
-            setInitializing(false)
-            setLoading(false)
-            apply.flush()
-        }
-    }, [cmd, JSON.stringify(params)]) //eslint-disable-line
-    return { list, loading, error, initializing, connecting, setList, updateList }
-
-    function updateList(cb: (toModify: Draft<typeof list>) => void) {
-        setList(produce(list, x => {
-            cb(x)
-        }))
-    }
-}