fix: preview component displayName

This commit is contained in:
JOYCEQL
2024-12-17 12:35:31 +08:00
committed by qingchen
parent c9dfd68139
commit e107f46ce1
2 changed files with 46 additions and 42 deletions
@@ -14,7 +14,7 @@ interface ExperienceItemProps {
globalSettings?: GlobalSettings;
}
const ExperienceItem: React.FC<ExperienceItemProps> = React.forwardRef(
const ExperienceItem = React.forwardRef<HTMLDivElement, ExperienceItemProps>(
({ experience, globalSettings }, ref) => {
return (
<motion.div
@@ -44,6 +44,8 @@ const ExperienceItem: React.FC<ExperienceItemProps> = React.forwardRef(
}
);
ExperienceItem.displayName = "ExperienceItem";
const ExperienceSection: React.FC<ExperienceSectionProps> = ({
experiences,
globalSettings,
@@ -5,6 +5,49 @@ import { motion, AnimatePresence } from "framer-motion";
import SectionTitle from "./SectionTitle";
import { Project, GlobalSettings } from "@/types/resume";
interface ProjectItemProps {
project: Project;
globalSettings?: GlobalSettings;
}
const ProjectItem = React.forwardRef<HTMLDivElement, ProjectItemProps>(
({ project, globalSettings }, ref) => {
return (
<motion.div
layout
style={{
marginTop: `${globalSettings?.paragraphSpacing}px`,
}}
>
<motion.div
layout="position"
className="flex items-center justify-between"
>
<h3 className="font-medium">{project.name}</h3>
{project.date && <div>{project.date}</div>}
</motion.div>
{project.role && (
<motion.div layout="position" className="font-medium text-baseFont">
{project.role}
</motion.div>
)}
{project.description && (
<motion.div
layout="position"
style={{
fontSize: `${globalSettings?.baseFontSize || 14}px`,
lineHeight: globalSettings?.lineHeight || 1.6,
}}
dangerouslySetInnerHTML={{ __html: project.description }}
></motion.div>
)}
</motion.div>
);
}
);
ProjectItem.displayName = "ProjectItem";
interface ProjectSectionProps {
projects: Project[];
globalSettings?: GlobalSettings;
@@ -44,45 +87,4 @@ const ProjectSection: React.FC<ProjectSectionProps> = ({
);
};
interface ProjectItemProps {
project: Project;
globalSettings?: GlobalSettings;
}
const ProjectItem: React.FC<ProjectItemProps> = React.forwardRef(
({ project, globalSettings }, ref) => {
return (
<motion.div
layout
style={{
marginTop: `${globalSettings?.paragraphSpacing}px`,
}}
>
<motion.div
layout="position"
className="flex items-center justify-between"
>
<h3 className="font-medium">{project.name}</h3>
{project.date && <div>{project.date}</div>}
</motion.div>
{project.role && (
<motion.div layout="position" className="font-medium text-baseFont">
{project.role}
</motion.div>
)}
{project.description && (
<motion.div
layout="position"
style={{
fontSize: `${globalSettings?.baseFontSize || 14}px`,
lineHeight: globalSettings?.lineHeight || 1.6,
}}
dangerouslySetInnerHTML={{ __html: project.description }}
></motion.div>
)}
</motion.div>
);
}
);
export default ProjectSection;