khamba/dist/components/FileTransfer.js

A cli tool for sharing files through local network.

import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { Box, Text } from 'ink';
import { log } from '../functions/log.js';
import SingleFileTransfer from '../components/SingleFileTransfer.js';
import { findLongestString, formatBytes } from '../functions/helper.js';
import { useStore } from '@nanostores/react';
import { $receiverTotalDownload, $currTransfer, } from '../stores/fileHandlerStore.js';
const FileTransfer = ({}) => {
    const currTransfer = useStore($currTransfer);
    const receiverTotalDownload = useStore($receiverTotalDownload);
    const [downloadIndex, setDownloadIndex] = useState(-1);
    const [isStartedTransferring, setIsStartedTransferring] = useState(false);
    const [isTransferComplete, setIsTransferComplete] = useState(false);
    const { files } = currTransfer;
    const totalFiles = Object.keys(files)?.length;
    const onSingleDownloadComplete = useCallback(() => {
        if (downloadIndex >= totalFiles - 1) {
            setIsTransferComplete(true);
            log('💯 Download Complete 💯');
            process.exit(0);
        }
        else {
            setDownloadIndex(prevIndex => prevIndex + 1);
        }
    }, [totalFiles, downloadIndex]);
    const longestNameLength = useMemo(() => {
        const longestLength = findLongestString(Object.values(files).map(file => file.fileName))
            ?.length ?? Infinity;
        return Math.min(longestLength, 30);
    }, [files]);
    useEffect(() => {
        if (!isStartedTransferring && !isTransferComplete) {
            setIsStartedTransferring(true);
            setDownloadIndex(0);
        }
    }, [isStartedTransferring, isTransferComplete]);
    return (React.createElement(Box, { borderColor: "green", borderStyle: "bold", paddingX: 1, flexDirection: "column", marginTop: 1 },
        React.createElement(Box, { flexDirection: "column" },
            React.createElement(Text, { backgroundColor: "green", color: "white", bold: true },
                ' ',
                currTransfer.peerInfo.peerName,
                ' ')),
        React.createElement(Text, { dimColor: true },
            isTransferComplete
                ? 'Files Transfer Complete 🎉'
                : isStartedTransferring
                    ? 'Receiving Files...'
                    : 'Files',
            "\u2800(",
            formatBytes(receiverTotalDownload),
            "\u2800/\u2800",
            formatBytes(currTransfer.totalFileSize),
            ")"),
        Object.keys(files).map((key, index) => (React.createElement(SingleFileTransfer, { key: key, index: index, downloadIndex: downloadIndex, state: files[key]?.state, error: files[key]?.errorMsg, fileInfo: {
                fileId: key,
                fileName: files[key]?.fileName,
                fileType: files[key]?.fileType,
                fileSize: files[key]?.totalSize,
            }, peerInfo: currTransfer.peerInfo, isStartedTransferring: isStartedTransferring, isTransferComplete: isTransferComplete, onSingleDownloadComplete: onSingleDownloadComplete, longestNameLength: longestNameLength })))));
};
export default FileTransfer;