@devvistatech/devvista-kit 0.0.1

package/dist/app/about/page.jsx

@@ -0,0 +1,259 @@
+"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;
+    return g = { next: verb(0), "throw": verb(1), "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 { motion } from "framer-motion";
+import { useState, useEffect } from "react";
+import { BioSection } from "@/components/addOns/functional/BioEditor";
+import Spinner from "@/components/addOns/non-functional/spinner";
+import { useStrapiAuth } from "@/lib/auth-context";
+import { useAuth, useUser } from "@clerk/nextjs";
+import Testimonials from "@/components/addOns/non-functional/Testimonials";
+import { ABOUT_PAGE } from "../constants/about";
+//test-again-again
+export default function AboutPage() {
+    var _this = this;
+    var _a = useStrapiAuth(), user = _a.user, authLoading = _a.authLoading, checkSession = _a.checkSession;
+    var getToken = useAuth().getToken;
+    var _b = useUser(), clerkUser = _b.user, isSignedIn = _b.isSignedIn;
+    var _c = useState(false), isMobile = _c[0], setIsMobile = _c[1];
+    var _d = useState(false), isLoading = _d[0], setIsLoading = _d[1];
+    var _e = useState(null), error = _e[0], setError = _e[1];
+    var _f = useState(null), bioImageUrl = _f[0], setBioImageUrl = _f[1];
+    var _g = useState(null), bioText = _g[0], setBioText = _g[1];
+    var _h = useState(null), bioTitle = _h[0], setBioTitle = _h[1];
+    var _j = useState(false), isEditModalOpen = _j[0], setIsEditModalOpen = _j[1];
+    useEffect(function () {
+        window.scrollTo(0, 0);
+    }, []);
+    useEffect(function () {
+        var event = new CustomEvent("modalStateChange", {
+            detail: { isOpen: isEditModalOpen },
+        });
+        window.dispatchEvent(event);
+    }, [isEditModalOpen]);
+    useEffect(function () {
+        var debounce = function (fn, delay) {
+            var timeout;
+            return function () {
+                clearTimeout(timeout);
+                timeout = setTimeout(fn, delay);
+            };
+        };
+        var checkMobile = debounce(function () {
+            setIsMobile(window.innerWidth < 768);
+        }, 100);
+        checkMobile();
+        window.addEventListener("resize", checkMobile);
+        return function () { return window.removeEventListener("resize", checkMobile); };
+    }, []);
+    useEffect(function () {
+        var handleLogin = function () { return checkSession(); };
+        var handleLogout = function () { return checkSession(); };
+        window.addEventListener("user-login", handleLogin);
+        window.removeEventListener("user-logout", handleLogout);
+        return function () {
+            window.removeEventListener("user-login", handleLogin);
+            window.removeEventListener("user-logout", handleLogout);
+        };
+    }, [checkSession]);
+    useEffect(function () {
+        var fetchBioData = function () { return __awaiter(_this, void 0, void 0, function () {
+            var response, errorData, result, bioData, err_1;
+            var _a;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
+                    case 0:
+                        setIsLoading(true);
+                        _b.label = 1;
+                    case 1:
+                        _b.trys.push([1, 6, 7, 8]);
+                        return [4 /*yield*/, fetch("/api/bio", {
+                                headers: { "Content-Type": "application/json" },
+                            })];
+                    case 2:
+                        response = _b.sent();
+                        if (!!response.ok) return [3 /*break*/, 4];
+                        return [4 /*yield*/, response.json()];
+                    case 3:
+                        errorData = _b.sent();
+                        throw new Error(errorData.error || ABOUT_PAGE.ERRORS.FETCH_BIO_FAILED);
+                    case 4: return [4 /*yield*/, response.json()];
+                    case 5:
+                        result = _b.sent();
+                        if (result.data) {
+                            bioData = result.data;
+                            setBioImageUrl(((_a = bioData.image) === null || _a === void 0 ? void 0 : _a.url) || null);
+                            setBioText(bioData.description || null);
+                            setBioTitle(bioData.title || null);
+                        }
+                        else {
+                            throw new Error(ABOUT_PAGE.ERRORS.BIO_NOT_FOUND);
+                        }
+                        return [3 /*break*/, 8];
+                    case 6:
+                        err_1 = _b.sent();
+                        console.error("Fetch Error:", err_1);
+                        setError(err_1 instanceof Error ? err_1.message : ABOUT_PAGE.ERRORS.FETCH_BIO_ERROR);
+                        return [3 /*break*/, 8];
+                    case 7:
+                        setIsLoading(false);
+                        return [7 /*endfinally*/];
+                    case 8: return [2 /*return*/];
+                }
+            });
+        }); };
+        fetchBioData();
+    }, []);
+    var handlePatchSubmit = function (e, formTitle, formDescription, formImage, onSuccess) { return __awaiter(_this, void 0, void 0, function () {
+        var formData, token, response, result, bioData, err_2;
+        var _a;
+        return __generator(this, function (_b) {
+            switch (_b.label) {
+                case 0:
+                    e.preventDefault();
+                    if (!(user === null || user === void 0 ? void 0 : user.businessAdminId)) {
+                        console.error("No user or businessAdminId:", { user: user, businessAdminId: user === null || user === void 0 ? void 0 : user.businessAdminId });
+                        setError(ABOUT_PAGE.ERRORS.UNAUTHORIZED_UPDATE);
+                        return [2 /*return*/];
+                    }
+                    _b.label = 1;
+                case 1:
+                    _b.trys.push([1, 5, , 6]);
+                    formData = new FormData();
+                    if (formTitle && formTitle !== bioTitle) {
+                        formData.append("title", formTitle);
+                    }
+                    if (formDescription && formDescription !== bioText) {
+                        formData.append("description", formDescription);
+                    }
+                    if (formImage) {
+                        if (!["image/jpeg", "image/png", "image/gif"].includes(formImage.type)) {
+                            throw new Error(ABOUT_PAGE.ERRORS.INVALID_IMAGE_TYPE);
+                        }
+                        formData.append("image", formImage);
+                    }
+                    if (!formData.has("title") && !formData.has("description") && !formData.has("image")) {
+                        onSuccess();
+                        return [2 /*return*/];
+                    }
+                    return [4 /*yield*/, getToken()];
+                case 2:
+                    token = _b.sent();
+                    if (!token) {
+                        throw new Error(ABOUT_PAGE.ERRORS.NO_AUTH_TOKEN);
+                    }
+                    return [4 /*yield*/, fetch("/api/bio", {
+                            method: "PUT",
+                            headers: {
+                                Authorization: "Bearer ".concat(token),
+                            },
+                            body: formData,
+                        })];
+                case 3:
+                    response = _b.sent();
+                    return [4 /*yield*/, response.json()];
+                case 4:
+                    result = _b.sent();
+                    if (!response.ok) {
+                        throw new Error(result.error || ABOUT_PAGE.ERRORS.UPDATE_BIO_FAILED);
+                    }
+                    if (result.data) {
+                        bioData = result.data;
+                        setBioImageUrl(((_a = bioData.image) === null || _a === void 0 ? void 0 : _a.url) || null);
+                        setBioText(bioData.description || null);
+                        setBioTitle(bioData.title || null);
+                        setError(null);
+                        onSuccess();
+                    }
+                    return [3 /*break*/, 6];
+                case 5:
+                    err_2 = _b.sent();
+                    console.error("Update Error:", err_2);
+                    setError(err_2 instanceof Error ? err_2.message : ABOUT_PAGE.ERRORS.UPDATE_BIO_ERROR);
+                    return [3 /*break*/, 6];
+                case 6: return [2 /*return*/];
+            }
+        });
+    }); };
+    var sectionVariants = {
+        hidden: { opacity: 0, y: 20 },
+        visible: {
+            opacity: 1,
+            y: 0,
+            transition: { duration: isMobile ? 0.3 : 0.5, ease: "easeOut" },
+        },
+    };
+    var cardVariants = {
+        hidden: { opacity: 0, y: 20 },
+        visible: {
+            opacity: 1,
+            y: 0,
+            transition: { duration: isMobile ? 0.3 : 0.5, ease: "easeOut" },
+        },
+        hover: {
+            scale: isMobile ? 1 : 1.05,
+            transition: { duration: 0.2, ease: "easeOut" },
+        },
+    };
+    var itemVariants = {
+        hidden: { opacity: 0, y: 10 },
+        visible: {
+            opacity: 1,
+            y: 0,
+            transition: { duration: isMobile ? 0.3 : 0.5, ease: "easeOut" },
+        },
+    };
+    if (authLoading || isLoading) {
+        return <Spinner />;
+    }
+    return (<div className="min-h-screen w-full bg-[#F7F7F7] relative flex flex-col">
+      <style jsx>{"\n        @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap\");\n\n        :root {\n          --jubilee: #F47C7C;\n          --natural-white: #F7F7F7;\n          --caviar: #2D2D2D;\n          --storm-cloud: #4A636E;\n          --exuberant-blue: #FF69B4;\n          --modern-purple: #D946EF;\n        }\n\n        * {\n          font-family: \"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n        }\n\n        .gradient-text {\n          background: linear-gradient(135deg, var(--exuberant-blue), var(--jubilee), var(--modern-purple));\n          -webkit-background-clip: text;\n          background-clip: text;\n          color: transparent;\n          text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n        }\n\n        .glassmorphism {\n          background: rgba(255, 255, 255, 0.1);\n          backdrop-filter: blur(12px);\n          -webkit-backdrop-filter: blur(12px);\n          border: 1px solid rgba(255, 255, 255, 0.2);\n          box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);\n          transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;\n        }\n\n        @supports not (backdrop-filter: blur(12px)) {\n          .glassmorphism {\n            background: rgba(255, 255, 255, 0.3);\n          }\n        }\n\n        .glassmorphism:hover {\n          box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);\n        }\n\n        @media (max-width: 768px) {\n          .glassmorphism {\n            padding: 1rem;\n          }\n          .gradient-text {\n            font-size: 2.5rem;\n          }\n        }\n\n        .line-clamp-8 {\n          display: -webkit-box;\n          -webkit-line-clamp: 8;\n          -webkit-box-orient: vertical;\n          overflow: hidden;\n        }\n      "}</style>
+      <div className="w-full pt-20 lg:pt-40 flex-grow relative z-10 container-padding bg-white">
+        <motion.h1 initial={{ opacity: 0, y: -50 }} animate={{ opacity: 1, y: 0 }} className="text-4xl sm:text-5xl lg:text-7xl font-black mb-20 lg:mb-20 gradient-text text-center uppercase drop-shadow-lg main-heading pt-36 sm:pt-32">
+          {ABOUT_PAGE.UI.MAIN_HEADING}
+        </motion.h1>
+        <BioSection user={user} authLoading={authLoading} bioImageUrl={bioImageUrl} bioText={bioText} bioTitle={bioTitle} error={error} isLoading={isLoading} setBioImageUrl={setBioImageUrl} setBioText={setBioText} setBioTitle={setBioTitle} setError={setError} handlePatchSubmit={handlePatchSubmit}/>
+        <Testimonials isMobile={isMobile}/>
+        <div className="px-20 py-52 sm:py-52 pt-32">
+          <h1 className="text-2xl sm:text-3xl font-extrabold pb-12 uppercase">
+            {ABOUT_PAGE.UI.SUCCESS_STORY_HEADING}
+          </h1>
+          <p>{ABOUT_PAGE.UI.SUCCESS_STORY_TEXT}</p>
+        </div>
+      </div>
+    </div>);
+}