fix: 修复ci中出现的错误
Some checks failed
Build and Push Docker Image / build-and-push (push) Failing after 4m29s
Some checks failed
Build and Push Docker Image / build-and-push (push) Failing after 4m29s
This commit is contained in:
@@ -2,14 +2,15 @@
|
|||||||
|
|
||||||
import { motion, AnimatePresence } from 'framer-motion';
|
import { motion, AnimatePresence } from 'framer-motion';
|
||||||
import { usePathname, useSearchParams } from 'next/navigation';
|
import { usePathname, useSearchParams } from 'next/navigation';
|
||||||
import { useEffect, useState, useRef } from 'react';
|
import { useEffect, useState, useRef, Suspense } from 'react';
|
||||||
import { useRouter } from 'next/navigation';
|
import { useRouter } from 'next/navigation';
|
||||||
|
|
||||||
interface PageTransitionProps {
|
interface PageTransitionProps {
|
||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function PageTransition({ children }: PageTransitionProps) {
|
// 内部组件:使用 useSearchParams 的部分
|
||||||
|
function PageTransitionContent({ children }: { children: React.ReactNode }) {
|
||||||
const pathname = usePathname();
|
const pathname = usePathname();
|
||||||
const searchParams = useSearchParams();
|
const searchParams = useSearchParams();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
@@ -96,13 +97,13 @@ export default function PageTransition({ children }: PageTransitionProps) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const getLoadingVariants = () => ({
|
const getLoadingVariants = () => ({
|
||||||
initial: {
|
initial: {
|
||||||
opacity: 0,
|
opacity: 0,
|
||||||
scale: 0.8,
|
scale: 0.8,
|
||||||
y: 20
|
y: 20
|
||||||
},
|
},
|
||||||
animate: {
|
animate: {
|
||||||
opacity: 1,
|
opacity: 1,
|
||||||
scale: 1,
|
scale: 1,
|
||||||
y: 0,
|
y: 0,
|
||||||
transition: {
|
transition: {
|
||||||
@@ -133,17 +134,17 @@ export default function PageTransition({ children }: PageTransitionProps) {
|
|||||||
>
|
>
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
<motion.div
|
<motion.div
|
||||||
animate={{
|
animate={{
|
||||||
rotate: 360,
|
rotate: 360,
|
||||||
scale: [1, 1.1, 1]
|
scale: [1, 1.1, 1]
|
||||||
}}
|
}}
|
||||||
transition={{
|
transition={{
|
||||||
rotate: { duration: 1, repeat: Infinity },
|
rotate: { duration: 1, repeat: Infinity },
|
||||||
scale: { duration: 1.5, repeat: Infinity }
|
scale: { duration: 1.5, repeat: Infinity }
|
||||||
}}
|
}}
|
||||||
className="w-12 h-12 border-4 border-orange-500 border-t-transparent rounded-full mx-auto mb-4"
|
className="w-12 h-12 border-4 border-orange-500 border-t-transparent rounded-full mx-auto mb-4"
|
||||||
/>
|
/>
|
||||||
<motion.p
|
<motion.p
|
||||||
className="text-lg font-medium text-gray-700 dark:text-gray-300"
|
className="text-lg font-medium text-gray-700 dark:text-gray-300"
|
||||||
initial={{ opacity: 0, y: 10 }}
|
initial={{ opacity: 0, y: 10 }}
|
||||||
animate={{ opacity: 1, y: 0 }}
|
animate={{ opacity: 1, y: 0 }}
|
||||||
@@ -171,3 +172,20 @@ export default function PageTransition({ children }: PageTransitionProps) {
|
|||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 加载状态组件
|
||||||
|
function PageTransitionFallback() {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen">
|
||||||
|
{null}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function PageTransition({ children }: PageTransitionProps) {
|
||||||
|
return (
|
||||||
|
<Suspense fallback={<PageTransitionFallback />}>
|
||||||
|
<PageTransitionContent>{children}</PageTransitionContent>
|
||||||
|
</Suspense>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user