Merge pull request #1 from orus-dev/blog-and-projects
Blog and projects
This commit is contained in:
Klesti Selimaj
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"title": "Welcome to ORUS!",
|
||||
"description": "ORUS is a organization for people just like you",
|
||||
"author": "Klesti Selimaj",
|
||||
"date": "2025-12-03",
|
||||
"readingTime": 1,
|
||||
"tags": ["welcome", "first", "ORUS"],
|
||||
"image": "/orus-logo.svg",
|
||||
"category": "news"
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
# Hello, World! 👋
|
||||
|
||||
Welcome! ORUS is a cybersecurity & dev organization, Simply for developers.
|
||||
|
||||
- 💻 open source: We love the open source community and our projects are all open source.
|
||||
- 📚 growing community: We are a growing community full of beginners and pros. join here
|
||||
- 🌐 cybersecurity & development: we develop projects for developers and cybersecurity enthusiasts
|
||||
Generated
+2032
-3
File diff suppressed because it is too large
Load Diff
+12
-1
@@ -9,10 +9,21 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"framer-motion": "^12.23.24",
|
||||
"highlight.js": "^11.11.1",
|
||||
"katex": "^0.16.25",
|
||||
"lucide-react": "^0.555.0",
|
||||
"next": "16.0.6",
|
||||
"react": "19.2.0",
|
||||
"react-dom": "19.2.0"
|
||||
"react-dom": "19.2.0",
|
||||
"react-markdown": "^10.1.0",
|
||||
"rehype-autolink-headings": "^7.1.0",
|
||||
"rehype-highlight": "^7.0.2",
|
||||
"rehype-katex": "^7.0.1",
|
||||
"rehype-raw": "^7.0.0",
|
||||
"rehype-slug": "^6.0.0",
|
||||
"remark-breaks": "^4.0.0",
|
||||
"remark-gfm": "^4.0.1",
|
||||
"remark-math": "^6.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
|
||||
@@ -0,0 +1,45 @@
|
||||
// app/api/blog/[slug]/route.ts
|
||||
import { NextRequest, NextResponse } from "next/server";
|
||||
import fs from "fs";
|
||||
import path from "path";
|
||||
import { PostPreview } from "@/lib/posts";
|
||||
|
||||
const BLOG_DIR = path.join(process.cwd(), "blog");
|
||||
|
||||
export async function GET(
|
||||
req: NextRequest,
|
||||
{ params }: { params: Promise<{ slug: string }> }
|
||||
) {
|
||||
try {
|
||||
const { slug } = await params;
|
||||
|
||||
// Read JSON metadata
|
||||
const jsonPath = path.join(BLOG_DIR, `${slug}.json`);
|
||||
if (!fs.existsSync(jsonPath)) {
|
||||
return NextResponse.json({ error: "Post not found" }, { status: 404 });
|
||||
}
|
||||
const rawData = fs.readFileSync(jsonPath, "utf-8");
|
||||
const data: Omit<PostPreview, "url"> = JSON.parse(rawData);
|
||||
|
||||
// Read Markdown content
|
||||
const mdPath = path.join(BLOG_DIR, `${slug}.md`);
|
||||
let content = "";
|
||||
if (fs.existsSync(mdPath)) {
|
||||
content = fs.readFileSync(mdPath, "utf-8");
|
||||
}
|
||||
|
||||
return NextResponse.json({
|
||||
meta: {
|
||||
...data,
|
||||
url: `/blog/${slug}`,
|
||||
},
|
||||
content,
|
||||
});
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
return NextResponse.json(
|
||||
{ error: "Internal server error" },
|
||||
{ status: 500 }
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,28 @@
|
||||
import { NextRequest, NextResponse } from "next/server";
|
||||
import fs from "fs";
|
||||
import path from "path";
|
||||
import { PostPreview } from "@/lib/posts";
|
||||
|
||||
const BLOG_DIR = path.join(process.cwd(), "blog");
|
||||
|
||||
export function getAllBlogPreviews(): PostPreview[] {
|
||||
const files = fs.readdirSync(BLOG_DIR).filter((f) => f.endsWith(".json"));
|
||||
|
||||
return files.map((file) => {
|
||||
const filePath = path.join(BLOG_DIR, file);
|
||||
const rawData = fs.readFileSync(filePath, "utf-8");
|
||||
const data = JSON.parse(rawData);
|
||||
|
||||
// Generate the URL based on filename
|
||||
const slug = file.replace(/\.json$/, "");
|
||||
|
||||
return {
|
||||
...data,
|
||||
url: `/blog/${slug}`,
|
||||
} as PostPreview;
|
||||
});
|
||||
}
|
||||
|
||||
export function GET(req: NextRequest): NextResponse {
|
||||
return NextResponse.json(getAllBlogPreviews());
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
import { NextRequest, NextResponse } from "next/server";
|
||||
|
||||
var lastGitRequest = new Date("2023-01-10T12:00:00Z");
|
||||
var stats = { stars: 0, forks: 0, contributors: 0 };
|
||||
|
||||
function isIterable(obj: any): obj is Iterable<any> {
|
||||
return obj != null && typeof obj[Symbol.iterator] === "function";
|
||||
}
|
||||
|
||||
async function getStats() {
|
||||
let page = 0;
|
||||
let stars = 0;
|
||||
let forks = 0;
|
||||
let contributors = 0;
|
||||
|
||||
while (true) {
|
||||
const res = await fetch(
|
||||
`https://api.github.com/users/orus-dev/repos?per_page=100&page=${page}`
|
||||
);
|
||||
const repos = await res.json();
|
||||
|
||||
if (repos.length === 0 || !isIterable(repos)) break;
|
||||
|
||||
for (const repo of repos) {
|
||||
stars += repo.stargazers_count;
|
||||
forks += repo.forks_count;
|
||||
const conRes = await fetch(repo.contributors_url);
|
||||
contributors += (await conRes.json()).length;
|
||||
}
|
||||
|
||||
page++;
|
||||
}
|
||||
|
||||
return { stars, forks, contributors };
|
||||
}
|
||||
|
||||
export async function GET(req: NextRequest) {
|
||||
const now = new Date();
|
||||
|
||||
if (now.getTime() - lastGitRequest.getTime() > 60 * 60 * 1000) {
|
||||
stats = await getStats();
|
||||
lastGitRequest = now;
|
||||
}
|
||||
|
||||
return NextResponse.json(stats);
|
||||
}
|
||||
@@ -0,0 +1,125 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { motion } from "framer-motion";
|
||||
import { Sparkles } from "lucide-react";
|
||||
import WebStuff from "@/components/Web";
|
||||
import { useParams } from "next/navigation";
|
||||
import { PostPreview } from "@/lib/posts";
|
||||
import Markdown from "@/components/Markdown";
|
||||
|
||||
export default function BlogPost() {
|
||||
const [post, setPost] = useState<{
|
||||
content: string;
|
||||
meta: PostPreview;
|
||||
} | null>(null);
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const { slug } = useParams();
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchPost() {
|
||||
const res = await fetch(`/api/blog/${slug}`);
|
||||
const data = await res.json();
|
||||
setPost(data);
|
||||
}
|
||||
|
||||
fetchPost();
|
||||
}, [slug]);
|
||||
|
||||
if (!post) {
|
||||
return (
|
||||
<WebStuff>
|
||||
<div className="min-h-screen flex items-center justify-center text-slate-400">
|
||||
Loading post...
|
||||
</div>
|
||||
</WebStuff>
|
||||
);
|
||||
}
|
||||
|
||||
const containerVariants = {
|
||||
hidden: { opacity: 0 },
|
||||
visible: { opacity: 1, transition: { staggerChildren: 0.1 } },
|
||||
};
|
||||
|
||||
const itemVariants = {
|
||||
hidden: { y: 20, opacity: 0 },
|
||||
visible: { y: 0, opacity: 1, transition: { duration: 0.5 } },
|
||||
};
|
||||
|
||||
return (
|
||||
<WebStuff>
|
||||
{/* Hero Section */}
|
||||
<motion.section
|
||||
className="relative z-10 px-6 py-16 lg:py-24 max-w-4xl mx-auto"
|
||||
variants={containerVariants}
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
>
|
||||
<motion.div variants={itemVariants} className="mb-4">
|
||||
<span className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500/10 border border-purple-500/20 rounded-full text-purple-400 text-sm">
|
||||
<Sparkles className="w-4 h-4" />
|
||||
{post.meta.category}
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
<motion.h1
|
||||
variants={itemVariants}
|
||||
className="text-5xl lg:text-6xl font-bold mb-6"
|
||||
>
|
||||
<span className="bg-linear-to-r from-white via-purple-200 to-blue-200 bg-clip-text text-transparent">
|
||||
{post.meta.title}
|
||||
</span>
|
||||
</motion.h1>
|
||||
|
||||
<motion.div
|
||||
variants={itemVariants}
|
||||
className="flex flex-wrap items-center gap-4 text-sm text-slate-400 mb-8"
|
||||
>
|
||||
<span>{post.meta.author}</span>
|
||||
<span>•</span>
|
||||
<span>{new Date(post.meta.date).toLocaleDateString()}</span>
|
||||
{post.meta.readingTime && (
|
||||
<>
|
||||
<span>•</span>
|
||||
<span>{post.meta.readingTime} min read</span>
|
||||
</>
|
||||
)}
|
||||
{post.meta.tags?.map((tag, idx) => (
|
||||
<span
|
||||
key={idx}
|
||||
className="px-2 py-1 bg-slate-800/50 border border-slate-700 rounded-full"
|
||||
>
|
||||
{tag}
|
||||
</span>
|
||||
))}
|
||||
</motion.div>
|
||||
|
||||
{/* Optional Featured Image */}
|
||||
{post.meta.image && (
|
||||
<motion.div
|
||||
variants={itemVariants}
|
||||
className="mb-8 overflow-hidden rounded-xl"
|
||||
>
|
||||
<img
|
||||
src={post.meta.image}
|
||||
alt={post.meta.title}
|
||||
className="w-full h-96 object-cover"
|
||||
/>
|
||||
</motion.div>
|
||||
)}
|
||||
|
||||
{/* Post Content */}
|
||||
<motion.section
|
||||
variants={itemVariants}
|
||||
className="prose prose-invert max-w-none text-slate-300"
|
||||
>
|
||||
<Markdown content={post.content} />
|
||||
</motion.section>
|
||||
</motion.section>
|
||||
</WebStuff>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,181 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import { motion } from "framer-motion";
|
||||
import { Sparkles } from "lucide-react";
|
||||
import WebStuff from "@/components/Web";
|
||||
import { PostPreview } from "@/lib/posts";
|
||||
|
||||
export default function Blog() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [activeFilter, setActiveFilter] = useState("all");
|
||||
const [projects, setProjects] = useState<PostPreview[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchPosts() {
|
||||
const res = await fetch(`/api/blog`);
|
||||
|
||||
setProjects(await res.json());
|
||||
}
|
||||
|
||||
fetchPosts();
|
||||
}, []);
|
||||
|
||||
const filters = [
|
||||
{ id: "all", label: "All Blogs" },
|
||||
{ id: "news", label: "News" },
|
||||
{ id: "guides", label: "Guides" },
|
||||
{ id: "research", label: "Research" },
|
||||
{ id: "journal", label: "Journal" },
|
||||
];
|
||||
|
||||
const filteredPosts =
|
||||
activeFilter === "all"
|
||||
? projects
|
||||
: projects.filter((p) => p.category === activeFilter);
|
||||
|
||||
const containerVariants = {
|
||||
hidden: {},
|
||||
visible: {
|
||||
transition: {
|
||||
staggerChildren: 0.1,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const itemVariants = {
|
||||
hidden: { opacity: 0, y: 20 },
|
||||
visible: {
|
||||
opacity: 1,
|
||||
y: 0,
|
||||
transition: { duration: 0.9 },
|
||||
},
|
||||
};
|
||||
|
||||
return (
|
||||
<WebStuff>
|
||||
{/* Hero Section */}
|
||||
<motion.section
|
||||
className="relative z-10 px-6 py-16 lg:py-24 max-w-7xl mx-auto"
|
||||
variants={containerVariants}
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
>
|
||||
<div className="text-center max-w-4xl mx-auto">
|
||||
<motion.div variants={itemVariants} className="mb-6">
|
||||
<span className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500/10 border border-purple-500/20 rounded-full text-purple-400 text-sm">
|
||||
<Sparkles className="w-4 h-4" />
|
||||
Latest Posts & Updates
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
<motion.h1
|
||||
variants={itemVariants}
|
||||
className="text-5xl lg:text-6xl font-bold mb-6"
|
||||
>
|
||||
<span className="bg-linear-to-r from-white via-purple-200 to-blue-200 bg-clip-text text-transparent">
|
||||
Project Updates
|
||||
</span>
|
||||
</motion.h1>
|
||||
|
||||
<motion.p
|
||||
variants={itemVariants}
|
||||
className="text-xl text-slate-300 mb-8 leading-relaxed max-w-3xl mx-auto"
|
||||
>
|
||||
Latest updates, articles, and guides from our team.
|
||||
</motion.p>
|
||||
|
||||
{/* Filter Tabs */}
|
||||
<motion.div
|
||||
variants={itemVariants}
|
||||
className="flex flex-wrap justify-center gap-3"
|
||||
>
|
||||
{filters.map((filter) => (
|
||||
<button
|
||||
key={filter.id}
|
||||
onClick={() => setActiveFilter(() => filter.id)}
|
||||
className={`px-6 py-2.5 rounded-lg font-medium transition-all ${
|
||||
activeFilter === filter.id
|
||||
? "bg-purple-500 text-white shadow-lg shadow-purple-500/50"
|
||||
: "bg-slate-800/50 text-slate-300 hover:bg-slate-700/50 border border-slate-700"
|
||||
}`}
|
||||
>
|
||||
{filter.label}
|
||||
</button>
|
||||
))}
|
||||
</motion.div>
|
||||
</div>
|
||||
</motion.section>
|
||||
|
||||
{/* Blog Posts List */}
|
||||
<section className="relative z-10 px-6 py-12 max-w-5xl mx-auto">
|
||||
<div className="flex flex-col gap-8">
|
||||
{filteredPosts.map((post, i) => (
|
||||
<motion.div
|
||||
key={i}
|
||||
className="relative group bg-slate-900/80 backdrop-blur border border-slate-700 rounded-2xl p-6 hover:border-purple-500/50 transition-colors"
|
||||
whileHover={{ y: -3, transition: { duration: 0.5 } }}
|
||||
variants={itemVariants}
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
>
|
||||
<div className="flex flex-col md:flex-row gap-4">
|
||||
{post.image && (
|
||||
<div className="shrink-0 w-full md:w-40 h-32 md:h-28 overflow-hidden rounded-xl">
|
||||
<img
|
||||
src={post.image}
|
||||
alt={post.title}
|
||||
className="w-full h-full object-cover"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex-1 flex flex-col justify-between">
|
||||
<div>
|
||||
<h3 className="text-2xl font-bold mb-2 group-hover:text-purple-400 transition-colors">
|
||||
{post.title}
|
||||
</h3>
|
||||
<p className="text-slate-300 mb-4 line-clamp-3">
|
||||
{post.description}
|
||||
</p>
|
||||
|
||||
<div className="flex flex-wrap items-center gap-3 text-sm text-slate-400 mb-4">
|
||||
<span>{post.author}</span>
|
||||
<span>•</span>
|
||||
<span>{new Date(post.date).toLocaleDateString()}</span>
|
||||
{post.readingTime && (
|
||||
<>
|
||||
<span>•</span>
|
||||
<span>{post.readingTime} min read</span>
|
||||
</>
|
||||
)}
|
||||
{post.tags?.map((tag, idx) => (
|
||||
<span
|
||||
key={idx}
|
||||
className="px-2 py-1 bg-slate-800/50 border border-slate-700 rounded-full"
|
||||
>
|
||||
{tag}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a
|
||||
href={post.url}
|
||||
className="self-start mt-auto inline-flex items-center gap-2 px-4 py-2 bg-purple-500/10 hover:bg-purple-500/20 border border-purple-500/20 rounded-lg text-sm font-medium text-purple-400 transition-colors"
|
||||
>
|
||||
Read More
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
</WebStuff>
|
||||
);
|
||||
}
|
||||
+7
-118
@@ -14,6 +14,7 @@ import {
|
||||
Lock,
|
||||
Sparkles,
|
||||
} from "lucide-react";
|
||||
import WebStuff from "@/components/Web";
|
||||
|
||||
export default function HomePage() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
@@ -86,82 +87,7 @@ export default function HomePage() {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-linear-to-br from-slate-950 via-purple-950 to-slate-950 text-white">
|
||||
{/* Animated background */}
|
||||
<div className="fixed inset-0 opacity-20">
|
||||
<div
|
||||
className="absolute inset-0"
|
||||
style={{
|
||||
backgroundImage: `radial-gradient(circle at 2px 2px, rgb(168, 85, 247) 1px, transparent 0)`,
|
||||
backgroundSize: "50px 50px",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Gradient orbs */}
|
||||
<div className="fixed inset-0 overflow-hidden pointer-events-none">
|
||||
<motion.div
|
||||
className="absolute top-1/4 -left-1/4 w-96 h-96 bg-purple-500/30 rounded-full blur-3xl"
|
||||
animate={{
|
||||
scale: [1, 1.2, 1],
|
||||
opacity: [0.3, 0.5, 0.3],
|
||||
}}
|
||||
transition={{
|
||||
duration: 8,
|
||||
repeat: Infinity,
|
||||
}}
|
||||
/>
|
||||
<motion.div
|
||||
className="absolute bottom-1/4 -right-1/4 w-96 h-96 bg-blue-500/30 rounded-full blur-3xl"
|
||||
animate={{
|
||||
scale: [1.2, 1, 1.2],
|
||||
opacity: [0.3, 0.5, 0.3],
|
||||
}}
|
||||
transition={{
|
||||
duration: 8,
|
||||
repeat: Infinity,
|
||||
delay: 1,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Navigation */}
|
||||
<motion.nav
|
||||
initial={{ y: -100 }}
|
||||
animate={{ y: 0 }}
|
||||
className="relative z-10 px-6 py-6 flex justify-between items-center max-w-7xl mx-auto"
|
||||
>
|
||||
<motion.div className="flex items-center">
|
||||
<img src="orus2.svg" alt="Logo" className="h-4" />
|
||||
</motion.div>
|
||||
|
||||
<div className="flex gap-6 items-center">
|
||||
{["Blog", "Projects", "About"].map((item, i) => (
|
||||
<motion.a
|
||||
key={item}
|
||||
href={`/${item.toLowerCase()}`}
|
||||
className="text-slate-300 hover:text-white transition-colors hidden md:block"
|
||||
initial={{ opacity: 0, y: -20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ delay: i * 0.1 }}
|
||||
whileHover={{ y: -2 }}
|
||||
>
|
||||
{item}
|
||||
</motion.a>
|
||||
))}
|
||||
<motion.a
|
||||
href="https://discord.gg/HFRsNxfCqT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500 hover:bg-purple-600 rounded-lg font-semibold transition-colors text-sm"
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
<MessageSquare className="w-4 h-4" />
|
||||
Join Discord
|
||||
</motion.a>
|
||||
</div>
|
||||
</motion.nav>
|
||||
|
||||
<WebStuff>
|
||||
{/* Hero Section */}
|
||||
<motion.section
|
||||
className="relative z-10 px-6 py-20 lg:py-32 max-w-7xl mx-auto"
|
||||
@@ -207,8 +133,7 @@ export default function HomePage() {
|
||||
className="flex flex-col sm:flex-row gap-4 justify-center"
|
||||
>
|
||||
<motion.a
|
||||
href="https://github.com/orus-dev"
|
||||
target="_blank"
|
||||
href="/projects"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-linear-to-r from-purple-600 to-blue-600 hover:from-purple-500 hover:to-blue-500 rounded-lg font-semibold text-lg shadow-lg shadow-purple-500/50"
|
||||
whileHover={{
|
||||
@@ -218,20 +143,19 @@ export default function HomePage() {
|
||||
whileTap={{ scale: 0.95 }}
|
||||
transition={{ type: "spring", stiffness: 300, damping: 20 }}
|
||||
>
|
||||
<Github className="w-5 h-5" />
|
||||
View Our Projects
|
||||
<ArrowRight className="w-5 h-5" />
|
||||
</motion.a>
|
||||
|
||||
<motion.a
|
||||
href="https://discord.gg/HFRsNxfCqT"
|
||||
href="https://github.com/orus-dev"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center justify-center gap-2 px-8 py-4 border-2 border-purple-500 hover:bg-purple-500/15 rounded-lg font-semibold text-lg transition-all"
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
<MessageSquare className="w-5 h-5" />
|
||||
Join Community
|
||||
Follow us on
|
||||
<Github className="w-5 h-5" />
|
||||
</motion.a>
|
||||
</motion.div>
|
||||
</div>
|
||||
@@ -355,41 +279,6 @@ export default function HomePage() {
|
||||
</div>
|
||||
</motion.div>
|
||||
</motion.section>
|
||||
|
||||
{/* Footer */}
|
||||
<footer className="relative z-10 px-6 py-12 border-t border-slate-800/50 mt-20">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="flex flex-col md:flex-row justify-between items-center gap-6">
|
||||
<img src="orus.svg" alt="Logo" className="h-4" />
|
||||
|
||||
<div className="text-slate-400 text-center">
|
||||
© 2025 ORUS. Open source for everyone. Built with 💜 for
|
||||
developers.
|
||||
</div>
|
||||
|
||||
<div className="flex gap-6">
|
||||
<motion.a
|
||||
href="https://github.com/orus-dev"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-slate-400 hover:text-purple-400 transition-colors"
|
||||
whileHover={{ scale: 1.2, rotate: 5 }}
|
||||
>
|
||||
<Github className="w-6 h-6" />
|
||||
</motion.a>
|
||||
<motion.a
|
||||
href="https://discord.gg/HFRsNxfCqT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-slate-400 hover:text-purple-400 transition-colors"
|
||||
whileHover={{ scale: 1.2, rotate: -5 }}
|
||||
>
|
||||
<MessageSquare className="w-6 h-6" />
|
||||
</motion.a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</WebStuff>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,316 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useEffect } from "react";
|
||||
import { motion } from "framer-motion";
|
||||
import {
|
||||
Github,
|
||||
MessageSquare,
|
||||
Sparkles,
|
||||
ExternalLink,
|
||||
Star,
|
||||
GitFork,
|
||||
} from "lucide-react";
|
||||
import WebStuff from "@/components/Web";
|
||||
import projects from "@/lib/projects";
|
||||
import formatNumber from "@/lib/formatNumber";
|
||||
|
||||
export default function Projects() {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [activeFilter, setActiveFilter] = useState("all");
|
||||
const [orgStats, setOrgStats] = useState({
|
||||
contributors: 0,
|
||||
stars: 0,
|
||||
forks: 0,
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
async function fetchStats() {
|
||||
const res = await fetch(`/api/stats`);
|
||||
|
||||
setOrgStats(await res.json());
|
||||
}
|
||||
|
||||
fetchStats();
|
||||
}, []);
|
||||
|
||||
const filters = [
|
||||
{ id: "all", label: "All Projects" },
|
||||
{ id: "security", label: "Security" },
|
||||
{ id: "devtools", label: "Dev Tools" },
|
||||
{ id: "infrastructure", label: "Infrastructure" },
|
||||
{ id: "communication", label: "Communication" },
|
||||
];
|
||||
|
||||
const filteredProjects =
|
||||
activeFilter === "all"
|
||||
? projects
|
||||
: projects.filter((p) => p.category === activeFilter);
|
||||
|
||||
const containerVariants = {
|
||||
hidden: { opacity: 0 },
|
||||
visible: {
|
||||
opacity: 1,
|
||||
transition: {
|
||||
staggerChildren: 0.1,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const itemVariants = {
|
||||
hidden: { y: 20, opacity: 0 },
|
||||
visible: {
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
transition: {
|
||||
duration: 0.5,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
return (
|
||||
<WebStuff>
|
||||
{/* Hero Section */}
|
||||
<motion.section
|
||||
className="relative z-10 px-6 py-16 lg:py-24 max-w-7xl mx-auto"
|
||||
variants={containerVariants}
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
>
|
||||
<div className="text-center max-w-4xl mx-auto">
|
||||
<motion.div variants={itemVariants} className="mb-6">
|
||||
<span className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500/10 border border-purple-500/20 rounded-full text-purple-400 text-sm">
|
||||
<Sparkles className="w-4 h-4" />
|
||||
Community Projects
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
<motion.h1
|
||||
variants={itemVariants}
|
||||
className="text-5xl lg:text-6xl font-bold mb-6"
|
||||
>
|
||||
<span className="bg-linear-to-r from-white via-purple-200 to-blue-200 bg-clip-text text-transparent">
|
||||
What We're Building
|
||||
</span>
|
||||
</motion.h1>
|
||||
|
||||
<motion.p
|
||||
variants={itemVariants}
|
||||
className="text-xl text-slate-300 mb-8 leading-relaxed max-w-3xl mx-auto"
|
||||
>
|
||||
Explore our projects designed to improve developers and enhance
|
||||
security across the ecosystem.
|
||||
</motion.p>
|
||||
|
||||
{/* Filter Tabs */}
|
||||
<motion.div
|
||||
variants={itemVariants}
|
||||
className="flex flex-wrap justify-center gap-3"
|
||||
>
|
||||
{filters.map((filter) => (
|
||||
<button
|
||||
key={filter.id}
|
||||
onClick={() => setActiveFilter(() => filter.id)}
|
||||
className={`px-6 py-2.5 rounded-lg font-medium transition-all ${
|
||||
activeFilter === filter.id
|
||||
? "bg-purple-500 text-white shadow-lg shadow-purple-500/50"
|
||||
: "bg-slate-800/50 text-slate-300 hover:bg-slate-700/50 border border-slate-700"
|
||||
}`}
|
||||
>
|
||||
{filter.label}
|
||||
</button>
|
||||
))}
|
||||
</motion.div>
|
||||
</div>
|
||||
</motion.section>
|
||||
|
||||
{/* Projects Grid */}
|
||||
<motion.section
|
||||
className="relative z-10 px-6 py-12 max-w-7xl mx-auto"
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
variants={containerVariants}
|
||||
>
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{filteredProjects.map((project, i) => (
|
||||
<motion.div
|
||||
key={i}
|
||||
layout
|
||||
className="relative group"
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.6, ease: "easeOut" }}
|
||||
viewport={{ once: true, amount: 0.3 }}
|
||||
whileHover={{ y: -8 }}
|
||||
>
|
||||
<div className="absolute inset-0 bg-linear-to-r from-purple-500/20 to-blue-500/20 rounded-2xl blur-xl group-hover:blur-2xl transition-all" />
|
||||
<div className="relative bg-slate-900/80 backdrop-blur border border-slate-700 hover:border-purple-500/50 rounded-2xl p-6 transition-all h-full flex flex-col">
|
||||
{/* Header */}
|
||||
<div className="flex items-start justify-between mb-4">
|
||||
<div className="inline-flex items-center justify-center w-12 h-12 bg-purple-500/10 rounded-xl">
|
||||
<project.icon className="w-6 h-6 text-purple-400" />
|
||||
</div>
|
||||
<span
|
||||
className={`px-3 py-1 rounded-full text-xs font-medium ${
|
||||
project.status === "Active"
|
||||
? "bg-green-500/10 text-green-400 border border-green-500/20"
|
||||
: "bg-yellow-500/10 text-yellow-400 border border-yellow-500/20"
|
||||
}`}
|
||||
>
|
||||
{project.status}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<h3 className="text-xl font-bold mb-2 group-hover:text-purple-400 transition-colors">
|
||||
{project.title}
|
||||
</h3>
|
||||
<p className="text-slate-400 text-sm mb-4 leading-relaxed grow">
|
||||
{project.description}
|
||||
</p>
|
||||
|
||||
{/* Stats */}
|
||||
<div className="flex items-center gap-4 mb-4 text-sm text-slate-400">
|
||||
<div className="flex items-center gap-1">
|
||||
<Star className="w-4 h-4" />
|
||||
<span>{project.stars.toLocaleString()}</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<GitFork className="w-4 h-4" />
|
||||
<span>{project.forks}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Tech Stack */}
|
||||
<div className="flex flex-wrap gap-2 mb-4">
|
||||
{project.tech.map((tech, idx) => (
|
||||
<span
|
||||
key={idx}
|
||||
className="px-2.5 py-1 bg-slate-800/50 border border-slate-700 rounded-md text-xs text-slate-300"
|
||||
>
|
||||
{tech}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Actions */}
|
||||
<div className="flex gap-2 pt-4 border-t border-slate-800">
|
||||
<a
|
||||
href={project.github}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex-1 inline-flex items-center justify-center gap-2 px-4 py-2 bg-slate-800 hover:bg-slate-700 rounded-lg text-sm font-medium transition-colors"
|
||||
>
|
||||
<Github className="w-4 h-4" />
|
||||
Code
|
||||
</a>
|
||||
{project.demo && (
|
||||
<a
|
||||
href={project.demo}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex-1 inline-flex items-center justify-center gap-2 px-4 py-2 bg-purple-500/10 hover:bg-purple-500/20 border border-purple-500/20 rounded-lg text-sm font-medium text-purple-400 transition-colors"
|
||||
>
|
||||
<ExternalLink className="w-4 h-4" />
|
||||
Demo
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
))}
|
||||
</div>
|
||||
</motion.section>
|
||||
|
||||
{/* Stats Section */}
|
||||
<motion.section
|
||||
className="relative z-10 px-6 py-20 max-w-7xl mx-auto"
|
||||
initial="hidden"
|
||||
whileInView="visible"
|
||||
viewport={{ once: true }}
|
||||
variants={containerVariants}
|
||||
>
|
||||
<motion.div
|
||||
variants={itemVariants}
|
||||
className="bg-slate-900/30 backdrop-blur border border-slate-800 rounded-3xl p-8 lg:p-12"
|
||||
>
|
||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-8">
|
||||
{[
|
||||
{ label: "Projects", value: `${projects.length}+` },
|
||||
{
|
||||
label: "Contributors",
|
||||
value: `${formatNumber(orgStats.contributors)}+`,
|
||||
},
|
||||
{ label: "Stars", value: `${formatNumber(orgStats.stars)}+` },
|
||||
{ label: "Forks", value: `${formatNumber(orgStats.forks)}+` },
|
||||
].map((stat, i) => (
|
||||
<motion.div
|
||||
key={i}
|
||||
variants={itemVariants}
|
||||
className="text-center"
|
||||
>
|
||||
<div className="text-3xl lg:text-4xl font-bold text-purple-400 mb-2">
|
||||
{stat.value}
|
||||
</div>
|
||||
<div className="text-slate-400">{stat.label}</div>
|
||||
</motion.div>
|
||||
))}
|
||||
</div>
|
||||
</motion.div>
|
||||
</motion.section>
|
||||
|
||||
{/* CTA Section */}
|
||||
<motion.section
|
||||
className="relative z-10 px-6 py-20 max-w-5xl mx-auto"
|
||||
initial="hidden"
|
||||
whileInView="visible"
|
||||
viewport={{ once: true }}
|
||||
variants={containerVariants}
|
||||
>
|
||||
<motion.div
|
||||
variants={itemVariants}
|
||||
className="relative overflow-hidden bg-linear-to-r from-purple-500/10 to-blue-500/10 backdrop-blur border border-purple-500/20 rounded-3xl p-12 text-center"
|
||||
>
|
||||
<div className="absolute inset-0 bg-linear-to-r from-purple-500/5 to-blue-500/5" />
|
||||
|
||||
<div className="relative">
|
||||
<h2 className="text-3xl lg:text-4xl font-bold mb-4">
|
||||
Want to Contribute?
|
||||
</h2>
|
||||
<p className="text-slate-300 text-lg mb-8 max-w-2xl mx-auto">
|
||||
All our projects are open source and welcoming to contributors.
|
||||
Join us in building tools that make a difference.
|
||||
</p>
|
||||
|
||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<motion.a
|
||||
href="https://github.com/orus-dev"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center justify-center gap-2 px-8 py-4 bg-purple-600 hover:bg-purple-500 rounded-lg font-semibold text-lg transition-colors"
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
<Github className="w-5 h-5" />
|
||||
View on GitHub
|
||||
</motion.a>
|
||||
|
||||
<motion.a
|
||||
href="https://discord.gg/HFRsNxfCqT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center justify-center gap-2 px-8 py-4 border border-slate-600 hover:border-slate-400 rounded-lg font-semibold text-lg transition-colors"
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
<MessageSquare className="w-5 h-5" />
|
||||
Join Discord
|
||||
</motion.a>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
</motion.section>
|
||||
</WebStuff>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,112 @@
|
||||
import React, { useState } from "react";
|
||||
import ReactMarkdown from "react-markdown";
|
||||
import remarkGfm from "remark-gfm";
|
||||
import remarkMath from "remark-math";
|
||||
import rehypeKatex from "rehype-katex";
|
||||
import rehypeHighlight from "rehype-highlight";
|
||||
import rehypeSlug from "rehype-slug";
|
||||
import rehypeAutolinkHeadings from "rehype-autolink-headings";
|
||||
import remarkBreaks from "remark-breaks";
|
||||
import rehypeRaw from "rehype-raw";
|
||||
import "katex/dist/katex.min.css";
|
||||
import "highlight.js/styles/github-dark.css";
|
||||
import "highlight.js/styles/github.css";
|
||||
import { CopyIcon } from "lucide-react";
|
||||
|
||||
interface MarkdownProps {
|
||||
content: string;
|
||||
components?: Record<string, React.ElementType>;
|
||||
darkMode?: boolean;
|
||||
}
|
||||
|
||||
const Markdown: React.FC<MarkdownProps> = ({
|
||||
content,
|
||||
components,
|
||||
darkMode = true,
|
||||
}) => {
|
||||
// Copy to clipboard handler
|
||||
const copyToClipboard = (text: string) => {
|
||||
navigator.clipboard.writeText(text);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className={darkMode ? "prose prose-invert" : "prose"}>
|
||||
<ReactMarkdown
|
||||
remarkPlugins={[remarkGfm, remarkMath]}
|
||||
rehypePlugins={[
|
||||
rehypeKatex,
|
||||
rehypeHighlight,
|
||||
rehypeSlug,
|
||||
rehypeAutolinkHeadings,
|
||||
rehypeRaw,
|
||||
remarkBreaks,
|
||||
]}
|
||||
components={{
|
||||
h1: ({ node, ...props }) => (
|
||||
<h1 className="text-4xl font-bold my-6" {...props} />
|
||||
),
|
||||
h2: ({ node, ...props }) => (
|
||||
<h2 className="text-3xl font-semibold my-5" {...props} />
|
||||
),
|
||||
h3: ({ node, ...props }) => (
|
||||
<h3 className="text-2xl font-semibold my-4" {...props} />
|
||||
),
|
||||
a: ({ href, children, ...props }) => (
|
||||
<a
|
||||
href={href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-purple-400 hover:underline"
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
</a>
|
||||
),
|
||||
code: ({ className, children, ...props }) => {
|
||||
const language = className?.replace("language-", "") || "";
|
||||
return (
|
||||
<div className="relative group my-4">
|
||||
<pre
|
||||
className={`rounded-lg p-4 overflow-x-auto ${
|
||||
darkMode ? "bg-gray-900" : "bg-gray-100"
|
||||
}`}
|
||||
>
|
||||
<code className={className} {...props}>
|
||||
{children}
|
||||
</code>
|
||||
</pre>
|
||||
<button
|
||||
onClick={() => copyToClipboard(String(children))}
|
||||
className="absolute top-2 right-2 opacity-0 group-hover:opacity-100 transition-opacity bg-gray-700 text-white px-2 py-1 text-sm rounded"
|
||||
>
|
||||
Copy
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
details: ({ node, ...props }) => (
|
||||
<details
|
||||
className="my-4 p-2 border rounded bg-gray-50 dark:bg-gray-800"
|
||||
{...props}
|
||||
/>
|
||||
),
|
||||
summary: ({ node, ...props }) => (
|
||||
<summary className="font-semibold cursor-pointer" {...props} />
|
||||
),
|
||||
ul: ({ ...props }) => (
|
||||
<ul {...props} className="list-disc list-inside my-1.5" />
|
||||
),
|
||||
ol: ({ ...props }) => (
|
||||
<ol {...props} className="list-decimal list-inside my-1.5" />
|
||||
),
|
||||
hr: ({ ...props }) => <hr {...props} className="my-4" />,
|
||||
...components,
|
||||
}}
|
||||
>
|
||||
{content}
|
||||
</ReactMarkdown>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Markdown;
|
||||
@@ -0,0 +1,163 @@
|
||||
import { motion } from "framer-motion";
|
||||
import { Github, MessageSquare } from "lucide-react";
|
||||
|
||||
export default function WebStuff({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children?: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<div className="min-h-screen bg-linear-to-br from-slate-950 via-purple-950 to-slate-950 text-white">
|
||||
{/* Animated background */}
|
||||
<div className="fixed inset-0 opacity-20">
|
||||
<div
|
||||
className="absolute inset-0"
|
||||
style={{
|
||||
backgroundImage: `radial-gradient(circle at 2px 2px, rgb(168, 85, 247) 1px, transparent 0)`,
|
||||
backgroundSize: "50px 50px",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Gradient orbs */}
|
||||
<div className="fixed inset-0 overflow-hidden pointer-events-none">
|
||||
<motion.div
|
||||
className="absolute top-1/4 -left-1/4 w-96 h-96 bg-purple-500/30 rounded-full blur-3xl"
|
||||
animate={{
|
||||
scale: [1, 1.2, 1],
|
||||
opacity: [0.3, 0.5, 0.3],
|
||||
}}
|
||||
transition={{
|
||||
duration: 8,
|
||||
repeat: Infinity,
|
||||
}}
|
||||
/>
|
||||
<motion.div
|
||||
className="absolute bottom-1/4 -right-1/4 w-96 h-96 bg-blue-500/30 rounded-full blur-3xl"
|
||||
animate={{
|
||||
scale: [1.2, 1, 1.2],
|
||||
opacity: [0.3, 0.5, 0.3],
|
||||
}}
|
||||
transition={{
|
||||
duration: 8,
|
||||
repeat: Infinity,
|
||||
delay: 1,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Navigation */}
|
||||
<motion.nav
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
variants={{
|
||||
hidden: { opacity: 0 },
|
||||
visible: {
|
||||
opacity: 1,
|
||||
transition: {
|
||||
duration: 0.5,
|
||||
},
|
||||
},
|
||||
}}
|
||||
className="relative z-10 px-6 py-6 flex justify-between items-center max-w-7xl mx-auto"
|
||||
>
|
||||
<motion.a
|
||||
className="flex items-center"
|
||||
href="/"
|
||||
initial={{ opacity: 0 }}
|
||||
animate={{ opacity: 1 }}
|
||||
transition={{ duration: 0.6, delay: 0.1 }}
|
||||
>
|
||||
<img src="orus2.svg" alt="Logo" className="h-4" />
|
||||
</motion.a>
|
||||
|
||||
{/* Menu */}
|
||||
<motion.div
|
||||
className="flex gap-6 items-center"
|
||||
variants={{
|
||||
hidden: {},
|
||||
visible: {
|
||||
transition: {
|
||||
staggerChildren: 0.08,
|
||||
delayChildren: 0.15,
|
||||
},
|
||||
},
|
||||
}}
|
||||
>
|
||||
{["Blog", "Projects", "About"].map((item) => (
|
||||
<motion.a
|
||||
key={item}
|
||||
href={`/${item.toLowerCase()}`}
|
||||
className="text-slate-300 hover:text-white transition-colors hidden md:block"
|
||||
variants={{
|
||||
hidden: { opacity: 0, y: -12 },
|
||||
visible: { opacity: 1, y: 0 },
|
||||
}}
|
||||
transition={{
|
||||
duration: 0.8,
|
||||
}}
|
||||
whileHover={{ y: -2 }}
|
||||
>
|
||||
{item}
|
||||
</motion.a>
|
||||
))}
|
||||
|
||||
<motion.a
|
||||
href="https://discord.gg/HFRsNxfCqT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="inline-flex items-center gap-2 px-4 py-2 bg-purple-500 hover:bg-purple-600 rounded-lg font-semibold transition-colors text-sm"
|
||||
variants={{
|
||||
hidden: { opacity: 0, y: -12 },
|
||||
visible: { opacity: 1, y: 0 },
|
||||
}}
|
||||
transition={{
|
||||
duration: 0.45,
|
||||
ease: [0.25, 0.1, 0.25, 1],
|
||||
}}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
<MessageSquare className="w-4 h-4" />
|
||||
Join Discord
|
||||
</motion.a>
|
||||
</motion.div>
|
||||
</motion.nav>
|
||||
|
||||
{children}
|
||||
|
||||
<footer className="relative z-10 px-6 py-12 border-t border-slate-800/50 mt-20">
|
||||
<div className="max-w-7xl mx-auto">
|
||||
<div className="flex flex-col md:flex-row justify-between items-center gap-6">
|
||||
<img src="orus.svg" alt="Logo" className="h-4" />
|
||||
|
||||
<div className="text-slate-400 text-center">
|
||||
© 2025 ORUS. Open source for everyone. Built with 💜 for
|
||||
developers.
|
||||
</div>
|
||||
|
||||
<div className="flex gap-6">
|
||||
<motion.a
|
||||
href="https://github.com/orus-dev"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-slate-400 hover:text-purple-400 transition-colors"
|
||||
whileHover={{ scale: 1.2, rotate: 5 }}
|
||||
>
|
||||
<Github className="w-6 h-6" />
|
||||
</motion.a>
|
||||
<motion.a
|
||||
href="https://discord.gg/HFRsNxfCqT"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-slate-400 hover:text-purple-400 transition-colors"
|
||||
whileHover={{ scale: 1.2, rotate: -5 }}
|
||||
>
|
||||
<MessageSquare className="w-6 h-6" />
|
||||
</motion.a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
export default function formatNumber(num: number): string {
|
||||
if (num === null) return num;
|
||||
if (num < 1000) return num.toString();
|
||||
if (num < 1_000_000)
|
||||
return (num / 1000).toFixed(num % 1000 === 0 ? 0 : 1) + "k";
|
||||
return (num / 1_000_000).toFixed(num % 1_000_000 === 0 ? 0 : 1) + "M";
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
export type PostPreview = {
|
||||
title: string;
|
||||
description: string;
|
||||
author: string;
|
||||
date: string;
|
||||
readingTime: number;
|
||||
tags: string[];
|
||||
image: string;
|
||||
url: string;
|
||||
category: "news" | "guides" | "journal" | "research";
|
||||
};
|
||||
@@ -0,0 +1,94 @@
|
||||
import {
|
||||
LucideIcon,
|
||||
MessageSquare,
|
||||
NetworkIcon,
|
||||
ServerIcon,
|
||||
} from "lucide-react";
|
||||
|
||||
type OrusProject = {
|
||||
title: string;
|
||||
description: string;
|
||||
category: string;
|
||||
icon: LucideIcon;
|
||||
stars: number;
|
||||
forks: number;
|
||||
tech: string[];
|
||||
status: "Active" | "Beta" | "Alpha" | "Planning";
|
||||
github: string;
|
||||
demo?: string;
|
||||
};
|
||||
|
||||
const orusProjects: OrusProject[] = [
|
||||
{
|
||||
title: "sentryx",
|
||||
description:
|
||||
"Multi-server management panel with high security — helps to host apps or media securely.",
|
||||
category: "infrastructure",
|
||||
icon: ServerIcon,
|
||||
stars: 1,
|
||||
forks: 3,
|
||||
tech: ["TypeScript", "Docker"],
|
||||
status: "Active",
|
||||
github: "https://github.com/orus-dev/sentryx",
|
||||
},
|
||||
{
|
||||
title: "ghostnet",
|
||||
description:
|
||||
"Privacy-focused protocol / spec designed to resist censorship and surveillance. ",
|
||||
category: "security",
|
||||
icon: NetworkIcon,
|
||||
stars: 1,
|
||||
forks: 0,
|
||||
tech: ["Specs", "P2P"],
|
||||
status: "Active",
|
||||
github: "https://github.com/orus-dev/ghostnet",
|
||||
},
|
||||
{
|
||||
title: "voxa",
|
||||
description:
|
||||
"A chat application (client side) — part of ORUS’s communication tools.",
|
||||
category: "communication",
|
||||
icon: MessageSquare,
|
||||
stars: 1,
|
||||
forks: 3,
|
||||
tech: ["TypeScript"],
|
||||
status: "Active",
|
||||
github: "https://github.com/orus-dev/voxa",
|
||||
},
|
||||
{
|
||||
title: "ghostnet-rs",
|
||||
description: "Rust implementation / library for the GhostNet protocol.",
|
||||
category: "security",
|
||||
icon: MessageSquare,
|
||||
stars: 0,
|
||||
forks: 2,
|
||||
tech: ["Rust", "P2P"],
|
||||
status: "Active",
|
||||
github: "https://github.com/orus-dev/ghostnet-rs",
|
||||
},
|
||||
{
|
||||
title: "orus",
|
||||
description: "The official ORUS website / landing page repository.",
|
||||
category: "infrastructure",
|
||||
icon: MessageSquare,
|
||||
stars: 0,
|
||||
forks: 0,
|
||||
tech: ["TypeScript"],
|
||||
status: "Active",
|
||||
github: "https://github.com/orus-dev/orus",
|
||||
},
|
||||
{
|
||||
title: "drift",
|
||||
description:
|
||||
"Productivity / organization app aiming to help users get rid of distractions.",
|
||||
category: "devtools",
|
||||
icon: MessageSquare,
|
||||
stars: 0,
|
||||
forks: 2,
|
||||
tech: ["TypeScript"],
|
||||
status: "Active",
|
||||
github: "https://github://github.com/orus-dev/drift",
|
||||
},
|
||||
];
|
||||
|
||||
export default orusProjects;
|
||||
Reference in New Issue
Block a user