Fixed warnings to make this build ready.
This commit is contained in:
parent
c132c52b37
commit
9aaa52b8d0
67
src/App.jsx
67
src/App.jsx
@ -1,5 +1,5 @@
|
|||||||
import React, { useState, useEffect } from "react";
|
import React, { useState, useEffect } from "react";
|
||||||
import { Layout, Typography, Space } from "antd";
|
import { Layout, Space } from "antd";
|
||||||
import { useLocation, useNavigate } from "react-router-dom";
|
import { useLocation, useNavigate } from "react-router-dom";
|
||||||
import { AnimatePresence, motion } from "framer-motion";
|
import { AnimatePresence, motion } from "framer-motion";
|
||||||
import ParticlesBackground from "./components/ParticlesBackground";
|
import ParticlesBackground from "./components/ParticlesBackground";
|
||||||
@ -17,65 +17,22 @@ import { LinkOutlined } from "@ant-design/icons";
|
|||||||
|
|
||||||
const { Content } = Layout;
|
const { Content } = Layout;
|
||||||
const { Footer } = Layout;
|
const { Footer } = Layout;
|
||||||
const { Title } = Typography;
|
|
||||||
|
|
||||||
const App = () => {
|
const App = () => {
|
||||||
const location = useLocation();
|
const location = useLocation(); // This gives you access to location object
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate(); // To navigate programmatically
|
||||||
|
|
||||||
const isMobile = useMediaQuery({ maxWidth: 600 });
|
const isMobile = useMediaQuery({ maxWidth: 600 });
|
||||||
|
|
||||||
|
// Get the query parameter from the URL
|
||||||
const getQueryParam = (param) => {
|
const getQueryParam = (param) => {
|
||||||
const searchParams = new URLSearchParams(location.search);
|
const searchParams = new URLSearchParams(location.search); // Use location.search directly
|
||||||
return searchParams.get(param) || "index";
|
return searchParams.get(param) || "index"; // Default to "index" if param is not found
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Initialize state with query parameters
|
||||||
const [currentView, setCurrentView] = useState(getQueryParam("to"));
|
const [currentView, setCurrentView] = useState(getQueryParam("to"));
|
||||||
const [referrer, setReferrer] = useState(getQueryParam("r"));
|
const referrer = getQueryParam("r");
|
||||||
const [isKeyboardOpen, setIsKeyboardOpen] = useState(false);
|
|
||||||
|
|
||||||
const initHandlers = () => {
|
|
||||||
// Add event listener to detect when input is focused
|
|
||||||
const handleFocus = () => {
|
|
||||||
setIsKeyboardOpen(true);
|
|
||||||
// Allow scrolling when input is focused
|
|
||||||
document.body.style.overflow = "auto";
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleBlur = () => {
|
|
||||||
setIsKeyboardOpen(false);
|
|
||||||
// Smooth scroll to top when input is blurred
|
|
||||||
window.scrollTo({
|
|
||||||
top: 0,
|
|
||||||
behavior: "smooth",
|
|
||||||
});
|
|
||||||
setTimeout(() => {
|
|
||||||
document.body.style.overflow = "hidden";
|
|
||||||
}, 500);
|
|
||||||
};
|
|
||||||
|
|
||||||
// Attach event listeners
|
|
||||||
document.querySelectorAll("input, textarea").forEach((input) => {
|
|
||||||
input.addEventListener("focus", handleFocus);
|
|
||||||
input.addEventListener("blur", handleBlur);
|
|
||||||
});
|
|
||||||
|
|
||||||
return () => {
|
|
||||||
// Clean up event listeners
|
|
||||||
document.querySelectorAll("input, textarea").forEach((input) => {
|
|
||||||
input.removeEventListener("focus", handleFocus);
|
|
||||||
input.removeEventListener("blur", handleBlur);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const newReferrer = getQueryParam("r");
|
|
||||||
if (newReferrer != "*") {
|
|
||||||
setReferrer(newReferrer); // Only update if 'r' exists
|
|
||||||
}
|
|
||||||
setCurrentView(getQueryParam("to"));
|
|
||||||
}, [location.search]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const queryParams = new URLSearchParams();
|
const queryParams = new URLSearchParams();
|
||||||
@ -91,18 +48,10 @@ const App = () => {
|
|||||||
// Navigate with the updated query string
|
// Navigate with the updated query string
|
||||||
navigate(`?${queryParams.toString()}`);
|
navigate(`?${queryParams.toString()}`);
|
||||||
|
|
||||||
// Initialize event handlers
|
|
||||||
const cleanup = initHandlers();
|
|
||||||
|
|
||||||
// Initial body setup to prevent scrollbars
|
// Initial body setup to prevent scrollbars
|
||||||
document.body.style.overflow = "hidden";
|
document.body.style.overflow = "hidden";
|
||||||
document.body.style.margin = "0";
|
document.body.style.margin = "0";
|
||||||
document.body.style.padding = "0";
|
document.body.style.padding = "0";
|
||||||
|
|
||||||
return () => {
|
|
||||||
cleanup();
|
|
||||||
document.body.style.overflow = "auto"; // Reset on unmount
|
|
||||||
};
|
|
||||||
}, [currentView, referrer, navigate]);
|
}, [currentView, referrer, navigate]);
|
||||||
|
|
||||||
const fadeVariants = {
|
const fadeVariants = {
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
import { useState, useEffect } from "react";
|
import { useState } from "react";
|
||||||
import { Modal } from "antd";
|
import { Modal } from "antd";
|
||||||
import Turnstile from "react-turnstile";
|
import Turnstile from "react-turnstile";
|
||||||
|
|
||||||
@ -8,7 +8,7 @@ const TurnstileModal = ({ open, onClose, onSuccess }) => {
|
|||||||
const handleVerify = (token) => {
|
const handleVerify = (token) => {
|
||||||
setTurnstileToken(token);
|
setTurnstileToken(token);
|
||||||
onClose(); // Close modal after verification
|
onClose(); // Close modal after verification
|
||||||
onSuccess(token); // Notify parent component
|
onSuccess(turnstileToken); // Notify parent component
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@ -3,7 +3,7 @@ import { useMediaQuery } from "react-responsive";
|
|||||||
import { Card, Flex, message } from "antd";
|
import { Card, Flex, message } from "antd";
|
||||||
import { LoadingOutlined } from "@ant-design/icons";
|
import { LoadingOutlined } from "@ant-design/icons";
|
||||||
|
|
||||||
const CacheReloadView = ({ setCurrentView }) => {
|
const CacheReloadView = () => {
|
||||||
const [loading, setLoading] = useState(true);
|
const [loading, setLoading] = useState(true);
|
||||||
const [error, setError] = useState(null);
|
const [error, setError] = useState(null);
|
||||||
|
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import React, { useState, useEffect } from "react";
|
import React, { useState, useEffect } from "react";
|
||||||
import { useMediaQuery } from "react-responsive";
|
import { useMediaQuery } from "react-responsive";
|
||||||
import { Tag, Button, Card, Flex, message } from "antd";
|
import { Tag, Button, Card, Flex, message } from "antd";
|
||||||
import { ArrowLeftOutlined, LoadingOutlined } from "@ant-design/icons";
|
import { LoadingOutlined } from "@ant-design/icons";
|
||||||
|
|
||||||
const BlogView = ({ setCurrentView, slug }) => {
|
const BlogView = ({ setCurrentView, slug }) => {
|
||||||
const [blog, setBlog] = useState(null);
|
const [blog, setBlog] = useState(null);
|
||||||
|
|||||||
@ -1,7 +1,7 @@
|
|||||||
import React, { useState, useEffect } from "react";
|
import React, { useState, useEffect } from "react";
|
||||||
import { useMediaQuery } from "react-responsive";
|
import { useMediaQuery } from "react-responsive";
|
||||||
import { Tag, Button, Card, Flex, message } from "antd";
|
import { Tag, Button, Card, Flex, message } from "antd";
|
||||||
import { LoadingOutlined, ArrowLeftOutlined } from "@ant-design/icons";
|
import { LoadingOutlined } from "@ant-design/icons";
|
||||||
|
|
||||||
const BlogsView = ({ setCurrentView }) => {
|
const BlogsView = ({ setCurrentView }) => {
|
||||||
const [blogs, setBlogs] = useState([]);
|
const [blogs, setBlogs] = useState([]);
|
||||||
@ -201,5 +201,4 @@ const BlogsView = ({ setCurrentView }) => {
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
export default BlogsView;
|
export default BlogsView;
|
||||||
|
|||||||
@ -1,11 +1,7 @@
|
|||||||
import React, { useState } from "react";
|
import React from "react";
|
||||||
import { useMediaQuery } from "react-responsive";
|
import { useMediaQuery } from "react-responsive";
|
||||||
import { Form, Input, Button, Card, Flex } from "antd";
|
import { Form, Input, Button, Card, Flex } from "antd";
|
||||||
import {
|
import { FilePdfOutlined, CloudDownloadOutlined } from "@ant-design/icons";
|
||||||
FilePdfOutlined,
|
|
||||||
CloudDownloadOutlined,
|
|
||||||
ArrowLeftOutlined,
|
|
||||||
} from "@ant-design/icons";
|
|
||||||
const CVView = ({ setCurrentView }) => {
|
const CVView = ({ setCurrentView }) => {
|
||||||
const onFinish = (values) => {
|
const onFinish = (values) => {
|
||||||
console.log("Form values:", values);
|
console.log("Form values:", values);
|
||||||
|
|||||||
@ -2,10 +2,9 @@ import React, { useState } from "react";
|
|||||||
import { useMediaQuery } from "react-responsive";
|
import { useMediaQuery } from "react-responsive";
|
||||||
import { Form, Input, Button, Card, Flex, message } from "antd";
|
import { Form, Input, Button, Card, Flex, message } from "antd";
|
||||||
import TurnstileModal from "../components/TurnstileModal";
|
import TurnstileModal from "../components/TurnstileModal";
|
||||||
import { ArrowRightOutlined, ArrowLeftOutlined } from "@ant-design/icons";
|
import { ArrowRightOutlined } from "@ant-design/icons";
|
||||||
const ContactView = ({ setCurrentView }) => {
|
const ContactView = ({ setCurrentView }) => {
|
||||||
const isMobile = useMediaQuery({ maxWidth: 600 });
|
const isMobile = useMediaQuery({ maxWidth: 600 });
|
||||||
const [isEmailFocused, setIsEmailFocused] = useState(false); // Track focus state
|
|
||||||
const [turnstileOpen, setTurnstileOpen] = useState(false);
|
const [turnstileOpen, setTurnstileOpen] = useState(false);
|
||||||
const [email, setEmail] = useState("");
|
const [email, setEmail] = useState("");
|
||||||
const handleSubmit = async (token) => {
|
const handleSubmit = async (token) => {
|
||||||
@ -80,8 +79,6 @@ const ContactView = ({ setCurrentView }) => {
|
|||||||
type="email"
|
type="email"
|
||||||
placeholder="example@example.com"
|
placeholder="example@example.com"
|
||||||
style={{ flex: 1 }}
|
style={{ flex: 1 }}
|
||||||
onFocus={() => setIsEmailFocused(true)} // Set focused state to true
|
|
||||||
onBlur={() => setIsEmailFocused(false)} // Set focused state to false
|
|
||||||
/>
|
/>
|
||||||
<Button type="primary" htmlType="submit">
|
<Button type="primary" htmlType="submit">
|
||||||
<ArrowRightOutlined />
|
<ArrowRightOutlined />
|
||||||
|
|||||||
@ -1,7 +1,6 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { useMediaQuery } from "react-responsive";
|
import { useMediaQuery } from "react-responsive";
|
||||||
import { Button, Card, Flex } from "antd";
|
import { Button, Card, Flex } from "antd";
|
||||||
import { ArrowLeftOutlined } from "@ant-design/icons";
|
|
||||||
const ExperienceView = ({ setCurrentView }) => {
|
const ExperienceView = ({ setCurrentView }) => {
|
||||||
const isMobile = useMediaQuery({ maxWidth: 600 });
|
const isMobile = useMediaQuery({ maxWidth: 600 });
|
||||||
return (
|
return (
|
||||||
|
|||||||
@ -7,7 +7,7 @@ import { LoadingOutlined } from "@ant-design/icons";
|
|||||||
import { useEffect } from "react";
|
import { useEffect } from "react";
|
||||||
import * as FaIcons from "react-icons/fa6"; // Import all FA6 icons dynamically
|
import * as FaIcons from "react-icons/fa6"; // Import all FA6 icons dynamically
|
||||||
|
|
||||||
const SocialsView = ({ referrer }) => {
|
const SocialsView = ({ referrer }) => {
|
||||||
const isMobile = useMediaQuery({ maxWidth: 600 });
|
const isMobile = useMediaQuery({ maxWidth: 600 });
|
||||||
const [socials, setSocials] = useState([]);
|
const [socials, setSocials] = useState([]);
|
||||||
const [loading, setLoading] = useState(true); // Loading state
|
const [loading, setLoading] = useState(true); // Loading state
|
||||||
@ -16,7 +16,7 @@ const SocialsView = ({ referrer }) => {
|
|||||||
const fetchSocials = async () => {
|
const fetchSocials = async () => {
|
||||||
try {
|
try {
|
||||||
const response = await fetch(
|
const response = await fetch(
|
||||||
`http://192.168.68.53:8787/api/list/socials?r=${referrer}`,
|
`https://web.tombutcher.work/api/list/socials?r=${referrer}`,
|
||||||
);
|
);
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
setSocials(data);
|
setSocials(data);
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user