@devvistatech/devvista-kit 0.0.10 → 0.0.13

package/dist/components/addOns/functional/FileUploader.jsx

@@ -1,222 +0,0 @@
-'use client';
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
-    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import { useState, useEffect } from 'react';
-import { UploadButton, ToggleButton, CloseButton, DeleteButton, CancelButton, TrashIconButton } from '@/components/other/button'; // Updated import
-import { Card } from '@/components/other/card';
-import { Upload, FileText, Trash2, X } from 'lucide-react';
-import { motion } from 'framer-motion';
-import { useUser } from '@clerk/nextjs';
-export function FileUploader(_a) {
-    var _this = this;
-    var uploadedFiles = _a.uploadedFiles, setUploadedFiles = _a.setUploadedFiles, setPdfUrl = _a.setPdfUrl, pdfUrl = _a.pdfUrl, isAdmin = _a.isAdmin, error = _a.error, setError = _a.setError, handleFileUpload = _a.handleFileUpload, handleDeleteFile = _a.handleDeleteFile;
-    var isSignedIn = useUser().isSignedIn;
-    var _b = useState(false), uploading = _b[0], setUploading = _b[1];
-    var _c = useState(false), showAllFiles = _c[0], setShowAllFiles = _c[1];
-    var _d = useState(false), isConfirmDeleteOpen = _d[0], setIsConfirmDeleteOpen = _d[1];
-    var _e = useState(null), fileToDelete = _e[0], setFileToDelete = _e[1];
-    var baseUrl = process.env.BASE_URL || '';
-    useEffect(function () { }, [isSignedIn, isAdmin]);
-    useEffect(function () {
-        var event = new CustomEvent('modalStateChange', {
-            detail: { isOpen: isConfirmDeleteOpen },
-        });
-        window.dispatchEvent(event);
-    }, [isConfirmDeleteOpen]);
-    useEffect(function () {
-        if (isConfirmDeleteOpen) {
-            document.body.classList.add('overflow-hidden');
-        }
-        else {
-            document.body.classList.remove('overflow-hidden');
-        }
-        return function () {
-            document.body.classList.remove('overflow-hidden');
-        };
-    }, [isConfirmDeleteOpen]);
-    useEffect(function () {
-        var handleEsc = function (e) {
-            if (e.key === 'Escape' && isConfirmDeleteOpen) {
-                handleCancelDelete();
-            }
-        };
-        window.addEventListener('keydown', handleEsc);
-        return function () { return window.removeEventListener('keydown', handleEsc); };
-    }, [isConfirmDeleteOpen]);
-    var openConfirmDelete = function (documentId) {
-        setFileToDelete(documentId);
-        setIsConfirmDeleteOpen(true);
-    };
-    var handleConfirmDelete = function () { return __awaiter(_this, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    if (!(fileToDelete !== null)) return [3 /*break*/, 4];
-                    setUploading(true);
-                    setError(null);
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, , 3, 4]);
-                    return [4 /*yield*/, handleDeleteFile(fileToDelete)];
-                case 2:
-                    _a.sent();
-                    return [3 /*break*/, 4];
-                case 3:
-                    setUploading(false);
-                    setIsConfirmDeleteOpen(false);
-                    setFileToDelete(null);
-                    return [7 /*endfinally*/];
-                case 4: return [2 /*return*/];
-            }
-        });
-    }); };
-    var handleCancelDelete = function () {
-        setIsConfirmDeleteOpen(false);
-        setFileToDelete(null);
-    };
-    var truncateText = function (text, maxLength) {
-        if (maxLength === void 0) { maxLength = 30; }
-        if (text.length <= maxLength)
-            return text;
-        return text.slice(0, maxLength - 3) + '...';
-    };
-    var modalVariants = {
-        hidden: { opacity: 0, y: '100vh' },
-        visible: { opacity: 1, y: 0, transition: { duration: 0.5, ease: [0.16, 1, 0.3, 1] } },
-        exit: { opacity: 0, y: '100vh', transition: { duration: 0.3, ease: 'easeIn' } },
-    };
-    var onFileChange = function (e) { return __awaiter(_this, void 0, void 0, function () {
-        return __generator(this, function (_a) {
-            switch (_a.label) {
-                case 0:
-                    setUploading(true);
-                    setError(null);
-                    _a.label = 1;
-                case 1:
-                    _a.trys.push([1, , 3, 4]);
-                    return [4 /*yield*/, handleFileUpload(e)];
-                case 2:
-                    _a.sent();
-                    return [3 /*break*/, 4];
-                case 3:
-                    setUploading(false);
-                    return [7 /*endfinally*/];
-                case 4: return [2 /*return*/];
-            }
-        });
-    }); };
-    return (<div className="w-full bg-[#1E2A44] px-4 py-12 sm:px-8 sm:py-16 border-none outline-none z-0">
-      <style jsx>{"\n        .modal-glassmorphism {\n          background: rgba(255, 255, 255, 0.08);\n          backdrop-filter: blur(10px);\n          -webkit-backdrop-filter: blur(10px);\n          border: 2px solid transparent;\n          border-image: linear-gradient(\n            45deg,\n            var(--exuberant-blue),\n            var(--jubilee),\n            var(--modern-purple)\n          ) 1;\n          box-shadow: 0 16px 48px rgba(0, 0, 0, 0.1);\n          border-radius: 2rem;\n          max-height: 90vh;\n          overflow: hidden;\n        }\n\n        @supports not (backdrop-filter: blur(10px)) {\n          .modal-glassmorphism {\n            background: rgba(255, 255, 255, 0.2);\n          }\n        }\n\n        @media (max-width: 640px) {\n          .modal-glassmorphism {\n            padding: 1rem;\n            max-height: 85vh;\n          }\n        }\n\n        .file-item {\n          z-index: 30;\n          pointer-events: auto;\n          cursor: pointer;\n        }\n      "}</style>
-      <Card className="w-full max-w-7xl mx-auto p-4 sm:p-8 bg-[#1E2A44] text-white flex flex-col items-center space-y-6 rounded-none border-none outline-none relative z-10">
-        <h3 className="text-2xl sm:text-3xl md:text-4xl font-bold tracking-tight text-white text-center">
-          Fitness Forum
-        </h3>
-        <div className="space-y-4 w-full">
-          {error && (<p className="text-red-400 text-base sm:text-lg md:text-xl text-center">{error}</p>)}
-          {isAdmin ? (<div className="flex flex-col sm:flex-row items-center justify-center space-y-4 sm:space-y-0 sm:space-x-4">
-              <input type="file" accept="application/pdf" onChange={onFileChange} disabled={uploading} className="hidden" id="file-upload"/>
-              <label htmlFor="file-upload" className="cursor-pointer">
-                <UploadButton disabled={uploading} asChild>
-                  <span className="flex items-center justify-center">
-                    <Upload className="mr-2 h-4 w-4 sm:h-5 sm:w-5"/>
-                    Upload PDF
-                  </span>
-                </UploadButton>
-              </label>
-              {uploading && (<span className="text-white font-bold text-base sm:text-lg">Uploading...</span>)}
-            </div>) : (<p className="text-gray-400 text-sm font-medium text-center">
-              {isSignedIn ? '' : ''}
-            </p>)}
-          {uploadedFiles.length > 0 ? (<>
-              {uploadedFiles.slice(0, showAllFiles ? undefined : 8).map(function (file) {
-                var token = localStorage.getItem('jwt') || '';
-                var fullUrl = file.url.startsWith('http')
-                    ? "".concat(file.url).concat(token ? (file.url.includes('?') ? '&' : '?') + "token=".concat(token) : '')
-                    : "".concat(baseUrl).concat(file.url).concat(token ? "?token=".concat(token) : '');
-                return (<div key={file.documentId} className="file-item flex flex-col sm:flex-row items-center justify-between p-4 sm:p-6 rounded-lg bg-[#2A3A66]/50 hover:bg-[#2A3A66]/70 hover:shadow-lg hover:border-[#FF69B4]/50 transition-all cursor-pointer" onClick={function () {
-                        setPdfUrl(fullUrl);
-                        window.open(fullUrl, '_blank', 'noopener,noreferrer');
-                    }} role="button" tabIndex={0} onKeyDown={function (e) {
-                        if (e.key === 'Enter' || e.key === ' ') {
-                            setPdfUrl(fullUrl);
-                            window.open(fullUrl, '_blank', 'noopener,noreferrer');
-                        }
-                    }} aria-label={"Open PDF: ".concat(truncateText(file.name))}>
-                    <div className="text-white font-bold text-base sm:text-lg md:text-xl flex items-center w-full sm:w-auto min-w-0 sm:pb-0 pb-6">
-                      <FileText className="mr-2 h-4 w-4 sm:h-5 sm:w-5 text-[#FF69B4] flex-shrink-0"/>
-                      <span className="truncate">{truncateText(file.name, 30)}</span>
-                    </div>
-                    {isAdmin && (<TrashIconButton onClick={function (e) {
-                            e.stopPropagation();
-                            openConfirmDelete(file.documentId);
-                        }} aria-label={"Delete file ".concat(truncateText(file.name))} variant="trash-icon" className="relative">
-                        <Trash2 />
-                      </TrashIconButton>)}
-                  </div>);
-            })}
-              {uploadedFiles.length > 8 && (<div className="text-center mt-4">
-                  <ToggleButton onClick={function () { return setShowAllFiles(!showAllFiles); }}>
-                    {showAllFiles ? 'Show Less' : 'Show More'}
-                  </ToggleButton>
-                </div>)}
-            </>) : (<p className="text-gray-300 font-bold text-base sm:text-lg md:text-xl text-center">
-              No files uploaded yet.
-            </p>)}
-        </div>
-      </Card>
-
-      {isConfirmDeleteOpen && isAdmin && (<motion.div variants={modalVariants} initial="hidden" animate="visible" exit="exit" className="fixed inset-0 bg-black/90 flex items-center justify-center z-[10000] p-4 isolate" onClick={handleCancelDelete} role="dialog" aria-modal="true" aria-labelledby="modal-title">
-          <div className="relative max-w-5xl w-full mx-4 p-6 bg-gray-800/50 border border-gray-700/50 rounded-lg shadow-lg" onClick={function (e) { return e.stopPropagation(); }}>
-            <CloseButton onClick={handleCancelDelete}>
-              <X className="h-6 w-6 sm:h-8 sm:w-8"/>
-            </CloseButton>
-            <h3 id="modal-title" className="text-xl font-bold text-white mb-4">
-              Confirm Deletion
-            </h3>
-            <p className="text-gray-300 text-sm mb-4">
-              Are you sure you want to delete this file? This action cannot be undone.
-            </p>
-            <div className="flex space-x-3">
-              <DeleteButton onClick={handleConfirmDelete} disabled={uploading}>
-                {uploading ? 'Deleting...' : 'Delete'}
-              </DeleteButton>
-              <CancelButton onClick={handleCancelDelete}>Cancel</CancelButton>
-            </div>
-          </div>
-        </motion.div>)}
-    </div>);
-}