emre/www_projectmycelium_com
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fixed build errors

Browse Source
This commit is contained in:
Emre
2025-10-24 04:17:02 +03:00
parent 3a7aa82ff7
commit 26fbea3ec4
16 changed files with 93 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@@ -4,8 +4,8 @@
<meta charset="UTF-8" />
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Mycelium - Unleash the Power of Decentralized Networks</title>
<meta name="description" content="Discover Mycelium, an end-to-end encrypted IPv6 overlay network. The future of secure, efficient, and scalable networking." />
<title>Project Mycelium - Unleash the Power of Decentralized Networks</title>
<meta name="description" content="Project Mycelium's technology enables anyone to deploy their own Internet infrastructure, anywhere." />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
</head>

1
src/components/Texts.tsx
View File

@@ -23,6 +23,7 @@ type TextOwnProps = {
font?: keyof typeof fontVariants
color?: keyof typeof colorVariants
className?: string
children?: React.ReactNode
}
// Polymorphic helpers

1
src/components/features-section-demo-1.tsx
View File

@@ -1,4 +1,3 @@
import React from "react";
import { useId } from "react";
export default function FeaturesSectionDemo() {

66
src/components/ui/HalfGlobe.tsx
View File

@@ -1,12 +1,15 @@
"use client";
import * as THREE from "three";
import { Canvas, useFrame } from "@react-three/fiber";
import { OrbitControls, useTexture } from "@react-three/drei";
import { useRef } from "react";
import { Line, OrbitControls, useTexture } from "@react-three/drei";
import { useMemo, useRef } from "react";
type RotatableGroup = {
rotation: { y: number };
};
function Globe() {
const groupRef = useRef<THREE.Group>(null);
const groupRef = useRef<RotatableGroup | null>(null);
const cloudTexture = useTexture("/images/cloud1.png");
// Rotate the globe slowly
@@ -17,7 +20,7 @@ function Globe() {
});
// Coordinates for markers (half-globe)
const points = [
const markers = [
[0, 1, 0],
[0.7, 0.5, 0.2],
[-0.5, 0.4, 0.5],
@@ -25,42 +28,47 @@ function Globe() {
[-0.6, -0.1, 0.3],
[0.3, -0.2, 0.8],
];
const arcPoints = useMemo(() => {
const radius = 2.5;
const verticalRadius = radius / 2;
const segments = 120;
return Array.from({ length: 8 }, () => {
const points: number[] = [];
for (let i = 0; i < segments; i++) {
const t = (i / (segments - 1)) * Math.PI;
const x = Math.cos(t) * radius;
const z = Math.sin(t) * verticalRadius;
const y = Math.sin(x / radius) * 0.5;
points.push(x, y, z);
}
return points;
});
}, []);
return (
<group ref={groupRef}>
{/* Cyan arcs */}
{Array.from({ length: 8 }).map((_, i) => {
const radius = 2.5;
const curve = new THREE.EllipseCurve(
0,
0,
radius,
radius / 2,
0,
Math.PI,
false,
0
);
const points = curve.getPoints(100);
const geometry = new THREE.BufferGeometry().setFromPoints(
points.map((p) => new THREE.Vector3(p.x, Math.sin(p.x / radius) * 0.5, p.y))
);
return (
<line key={i} geometry={geometry}>
<lineBasicMaterial color="#00e5ff" linewidth={1} transparent opacity={0.5} />
</line>
);
})}
{arcPoints.map((points, i) => (
<Line
key={i}
points={points}
color="#00e5ff"
lineWidth={1}
transparent
opacity={0.5}
/>
))}
{/* Cloud markers */}
{points.map(([x, y, z], i) => (
{markers.map(([x, y, z], i) => (
<mesh key={i} position={[x * 2.5, y * 2.5, z * 2.5]}>
<planeGeometry args={[0.3, 0.3]} />
<meshBasicMaterial
map={cloudTexture}
transparent
opacity={1}
side={THREE.DoubleSide}
side={2 /* DoubleSide */}
/>
</mesh>
))}

6
src/components/ui/aurora-background.tsx
View File

@@ -1,8 +1,8 @@
"use client";
import { cn } from "@/lib/utils";
import React, { ReactNode } from "react";
import type { CSSProperties, HTMLProps, ReactNode } from "react";
interface AuroraBackgroundProps extends React.HTMLProps<HTMLDivElement> {
interface AuroraBackgroundProps extends HTMLProps<HTMLDivElement> {
children: ReactNode;
showRadialGradient?: boolean;
}
@@ -44,7 +44,7 @@ export const AuroraBackground = ({
"--black": "#000",
"--white": "#fff",
"--transparent": "transparent",
} as React.CSSProperties
} as CSSProperties
}
>
<div

6
src/components/ui/dotted-glow-background.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import React, { useEffect, useRef, useState } from "react";
import { useEffect, useRef, useState } from "react";
type DottedGlowBackgroundProps = {
className?: string;
@@ -203,12 +203,8 @@ export function DottedGlowBackground({
regenDots();
let last = performance.now();
const draw = (now: number) => {
if (stopped) return;
const dt = (now - last) / 1000; // seconds
last = now;
const { width, height } = container.getBoundingClientRect();
ctx.clearRect(0, 0, el.width, el.height);

1
src/pages/agents/Companies.tsx
View File

@@ -1,6 +1,5 @@
"use client";
import React from "react";
import { motion } from "framer-motion";
import { P, Eyebrow } from "@/components/Texts";
import { InfiniteMovingCards } from "@/components/magicui/infinite-moving-cards";

28
src/pages/agents/DeploySection.tsx
View File

@@ -2,25 +2,45 @@
import { motion } from "framer-motion";
import { SectionHeader, P, Eyebrow, CT, CP } from "@/components/Texts";
import { TbCircleNumber1Filled, TbCircleNumber2Filled, TbCircleNumber3Filled } from "react-icons/tb";
import type { ComponentPropsWithoutRef } from "react";
type CircleIconProps = ComponentPropsWithoutRef<"svg">;
const CircleNumber1Icon = (props: CircleIconProps) => (
<svg viewBox="0 0 24 24" fill="currentColor" {...props}>
<path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2zm.994 5.886c-.083-.777-1.008-1.16-1.617-.67l-.084.077-2 2-.083.094a1 1 0 000 1.226l.083.094.094.083a1 1 0 001.226 0l.094-.083.293-.293v5.586l.007.117a1 1 0 001.986 0l.007-.117v-8l-.006-.114z" />
</svg>
);
const CircleNumber2Icon = (props: CircleIconProps) => (
<svg viewBox="0 0 24 24" fill="currentColor" {...props}>
<path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2zm1 5h-3l-.117.007a1 1 0 000 1.986l.117.007h3v2h-2l-.15.005a2 2 0 00-1.844 1.838l-.006.157v2l.005.15a2 2 0 001.838 1.844l.157.006h3l.117-.007a1 1 0 000-1.986l-.117-.007h-3v-2h2l.15-.005a2 2 0 001.844-1.838l.006-.157v-2l-.005-.15a2 2 0 00-1.838-1.844l-.157-.006z" />
</svg>
);
const CircleNumber3Icon = (props: CircleIconProps) => (
<svg viewBox="0 0 24 24" fill="currentColor" {...props}>
<path d="M12 2c5.523 0 10 4.477 10 10s-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2zm1 5h-2l-.15.005a2 2 0 00-1.85 1.995 1 1 0 001.974.23l.02-.113.006-.117h2v2h-2l-.133.007c-1.111.12-1.154 1.73-.128 1.965l.128.021.133.007h2v2h-2l-.007-.117a1 1 0 00-1.993.117 2 2 0 001.85 1.995l.15.005h2l.15-.005a2 2 0 001.844-1.838l.006-.157v-2l-.005-.15a1.988 1.988 0 00-.17-.667l-.075-.152-.019-.032.02-.03a2.01 2.01 0 00.242-.795l.007-.174v-2l-.005-.15a2 2 0 00-1.838-1.844l-.157-.006z" />
</svg>
);
const features = [
{
name: 'Choose Your Intelligence',
description: 'Explore a library of leading LLMs and agentic functions. Pick the ones that fit your use case, from general assistants to specialized reasoning models.',
icon: TbCircleNumber1Filled,
icon: CircleNumber1Icon,
},
{
name: 'Add Your Knowledge',
description:
'Connect your data or knowledge base to enable personalized, context-aware results while keeping your information private.',
icon: TbCircleNumber2Filled,
icon: CircleNumber2Icon,
},
{
name: 'Define Your Network',
description:
'Set up and manage your nodes with ease. Scale compute and storage as you grow, while staying fully sovereign and decentralized.',
icon: TbCircleNumber3Filled,
icon: CircleNumber3Icon,
},
];

2
src/pages/home/HomeAurora.tsx
View File

@@ -18,7 +18,7 @@ export function HomeAurora() {
<span className="text-bold lg:text-8xl">
Project Mycelium.
<br className="hidden lg:block" />
Full Sovereignty for Cloud, Network & AI.
Full Sovereignty for<br />Cloud, Network & AI.
</span>
</H1>
</div>

9
src/pages/home/HomeBenefits.tsx
View File

@@ -1,7 +1,6 @@
import React from "react";
import { cn } from "@/lib/utils";
import createGlobe from "cobe";
import { useEffect, useRef } from "react";
import { useEffect, useRef, type ReactNode } from "react";
import { motion } from "motion/react";
import { IconBrandYoutubeFilled } from "@tabler/icons-react";
import { LockClosedIcon, CogIcon, BoltIcon, CurrencyDollarIcon } from '@heroicons/react/24/solid'
@@ -67,7 +66,7 @@ const FeatureCard = ({
children,
className,
}: {
children?: React.ReactNode;
children?: ReactNode;
className?: string;
}) => {
return (
@@ -77,7 +76,7 @@ const FeatureCard = ({
);
};
const FeatureTitle = ({ children, icon }: { children?: React.ReactNode, icon?: React.ReactNode }) => {
const FeatureTitle = ({ children, icon }: { children?: ReactNode; icon?: ReactNode }) => {
return (
<div className="flex items-center gap-2">
{icon}
@@ -88,7 +87,7 @@ const FeatureTitle = ({ children, icon }: { children?: React.ReactNode, icon?: R
);
};
const FeatureDescription = ({ children }: { children?: React.ReactNode }) => {
const FeatureDescription = ({ children }: { children?: ReactNode }) => {
return (
<p
className={cn(

2
src/pages/home/HomeGlobe.tsx
View File

@@ -2,7 +2,7 @@
import { Globe } from "@/components/ui/Globe"
import { motion } from "framer-motion"
import { H2, P, CT, CP, SectionHeader, Eyebrow } from "@/components/Texts"
import { P, CT, CP, SectionHeader, Eyebrow } from "@/components/Texts"
import { CountUpNumber } from '@/components/CountUpNumber'
export function WorldMap() {

3
src/pages/home/HomePage.tsx
View File

@@ -1,9 +1,6 @@
import { AnimatedSection } from '../../components/AnimatedSection'
import { HomeAurora } from './HomeAurora'
import { HomeFeatures } from './HomeFeatures'
import { HomeFeaturesDark } from './HomeFeaturesDark'
import { HomeCloud } from './HomeCloud'
import { HomeAgent } from './HomeAgent'
import { StackSectionLight } from './StackSection'
import { WorldMap } from './HomeGlobe'
import { HomeBenefits } from './HomeBenefits'

2
src/pages/home/StackSection.tsx
View File

@@ -2,7 +2,7 @@
import { motion } from "framer-motion";
import { StackedCubesLight } from "@/components/ui/StackedCubesLight";
import { H2, P, SectionHeader, Eyebrow } from "@/components/Texts";
import { P, SectionHeader, Eyebrow } from "@/components/Texts";
import { FadeIn } from "@/components/ui/FadeIn";
import { DottedGlowBackground } from '@/components/ui/dotted-glow-background';

7
src/pages/network/PrimaryFeatures.tsx
View File

@@ -6,7 +6,6 @@ import clsx from 'clsx'
import {
type MotionProps,
type Variant,
type Variants,
AnimatePresence,
motion,
} from 'framer-motion'
@@ -137,12 +136,6 @@ function DeviceTouchIcon(props: React.ComponentPropsWithoutRef<'svg'>) {
)
}
const headerAnimation: Variants = {
initial: { opacity: 0, transition: { duration: 0.3 } },
animate: { opacity: 1, transition: { duration: 0.3, delay: 0.3 } },
exit: { opacity: 0, transition: { duration: 0.3 } },
}
const maxZIndex = 2147483647
const bodyVariantBackwards: Variant = {

1
src/pages/network/animations/ContentDistribution.tsx
View File

@@ -7,7 +7,6 @@ type Props = {
const ACCENT = '#00b8db';
const STROKE = '#111827';
const GRAY = '#9CA3AF';
const GRAY_LT = '#E5E7EB';
const IconSquare = () => (

18
vite.config.ts
View File

@@ -10,4 +10,22 @@ export default defineConfig({
'@': path.resolve(__dirname, './src'),
},
},
build: {
rollupOptions: {
output: {
manualChunks: {
react: ['react', 'react-dom', 'react-router', 'react-router-dom'],
framer: ['framer-motion'],
motion: ['motion/react'],
antd: [
'antd',
'rc-field-form',
'rc-motion',
'@ant-design/cssinjs',
'@rc-component/async-validator',
],
},
},
},
},
})