chore(projects): replace EternalFoundation with EternalShowcase, …

[vLuckyyy]

…optimize animations, and remove @xyflow/react

[netlify]

✅ Deploy Preview for eternalcodeteam-website ready!

Name	Link
🔨 Latest commit	12404be
🔍 Latest deploy log	https://app.netlify.com/projects/eternalcodeteam-website/deploys/69716ab9d516af5ff73f6f46
😎 Deploy Preview	https://deploy-preview-207--eternalcodeteam-website.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[gemini-code-assist]

Summary of Changes

Hello @vLuckyyy, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request introduces a major refactor to the EternalCore project page, transforming its visual presentation and user interaction. The core change involves replacing a static flow diagram with a dynamic, engaging showcase of features, complete with interactive elements and optimized animations. These updates aim to provide a more modern and performant user experience while streamlining project dependencies.

Highlights

• Component Replacement and Renaming: The EternalFoundation component, which previously displayed a ReactFlow diagram, has been removed and replaced with a new EternalShowcase component. This new component provides an interactive display of project features.
• New EternalShowcase Component: A new EternalShowcase component has been introduced, featuring an infinite marquee effect to showcase various project features using GIFs. It includes an interactive modal for detailed viewing of each feature.
• Animation Optimizations and Enhancements: The project page (page.tsx) has undergone significant animation improvements. This includes the implementation of staggered entry animations using StaggerContainer and slideUp variants, replacement of FadeIn with ScaleIn for the project banner, and updated styling and hover effects for feature cards. New background decor elements have also been added.
• Dependency Management: The @xyflow/react library and its related D3 dependencies, along with classcat, use-sync-external-store, and zustand, have been removed from the project dependencies. A new dependency, gsap, has been added.
• Configuration Preview Refinements: The configuration preview section has been updated with a subtle blur effect and enhanced hover interactions, improving its visual presentation.

🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request is a great improvement, replacing the EternalFoundation component with the more dynamic and visually engaging EternalShowcase. The removal of the @xyflow/react dependency and the optimization of animations using framer-motion's staggering capabilities significantly enhance both performance and user experience. My feedback includes a couple of suggestions to further refine the new components for better performance and maintainability.

[gemini-code-assist]

The InfiniteMarquee component currently triplicates the items array. For a seamless loop with a -50% translation on the x-axis, duplicating the items ([...items, ...items]) is sufficient. This change reduces the number of DOM elements, which can improve performance, especially with a large number of items.

Suggested change

	{[...items, ...items, ...items].map((item, i) => (
	{[...items, ...items].map((item, i) => (

[gemini-code-assist]

This div wrapper has the same classes as the one on line 41. To avoid code duplication and improve maintainability, you could extract this into a reusable layout component, for example, a SectionWrapper. This would make future style changes easier to manage.