openship 0.1.1 → 0.1.8

package/apps/dashboard/src/app/(dashboard)/projects/[id]/components/general/ProjectIdentity.tsx

@@ -1,159 +0,0 @@
-"use client";
-import React, { useState } from "react";
-import { generateIcon } from "@/utils/icons";
-import { useProjectSettings } from "@/context/ProjectSettingsContext";
-import { projectsApi } from "@/lib/api";
-import { useToast } from "@/context/ToastContext";
-
-export const ProjectIdentity: React.FC = () => {
-  const { projectData, updateProjectData } = useProjectSettings();
-  const [isEditingName, setIsEditingName] = useState(false);
-  const [isEditingDescription, setIsEditingDescription] = useState(false);
-
-  const [tempData, setTempData] = useState({ 
-    name: projectData.name || '',
-    description: projectData.description || '',
-    framework: projectData.framework || ''
-  });
-
-  const [loading, setLoading] = useState({
-    name: false,
-    description: false,
-  });
-  
-  const { showToast } = useToast();
-
-  const handleSaveName = async () => {
-    setLoading({ ...loading, name: true });
-    const response = await projectsApi.update(projectData.id, 'name', tempData.name);
-    if (response.success) {
-      updateProjectData({ name: tempData.name });
-      setIsEditingName(false);
-    } else {
-      showToast(response.message, 'error', 'Failed to update project name');
-    }
-    setLoading({ ...loading, name: false });
-  };
-
-  const handleSaveDescription = async () => {
-    const response = await projectsApi.update(projectData.id, 'description', tempData.description);
-    if (response.success) {
-      updateProjectData({ description: tempData.description });
-      setIsEditingDescription(false);
-    } else {
-      showToast(response.message, 'error', 'Failed to update project description');
-    }
-    setLoading({ ...loading, description: false });
-  };
-
-  const handleCancelName = () => {
-    setTempData((prev) => ({ ...prev, name: projectData.name || '' }));
-    setIsEditingName(false);
-    setLoading({ ...loading, name: false });
-  };
-
-  const handleCancelDescription = () => {
-    setTempData((prev) => ({ ...prev, description: projectData.description || '' }));
-    setIsEditingDescription(false);
-    setLoading({ ...loading, description: false });
-  };
-
-
-  return (
-    <div className="bg-white rounded-[20px] border border-black/5 p-6">
-      {/* Header */}
-      <div className="flex items-center gap-3 mb-6">
-        {generateIcon('layers-363-1658238246.png', 28, 'rgb(79, 70, 229)')}
-        <h3 className="text-lg font-semibold text-black">Project Identity</h3>
-      </div>
-      
-      <div className="flex flex-col lg:flex-row gap-5 lg:gap-6">
-        {/* Project Name */}
-        <div className="flex-1">
-          <label className="text-sm font-medium text-black/70 mb-2 block">Project Name</label>
-          
-          {isEditingName ? (
-            <div className="space-y-3">
-              <input
-                type="text"
-                value={tempData.name}
-                onChange={(e) => setTempData((prev) => ({ ...prev, name: e.target.value }))}
-                placeholder="my-awesome-project"
-                className="w-full px-4 py-2.5 bg-black/5 border border-transparent rounded-xl focus:ring-2 focus:ring-indigo-500/20 focus:border-indigo-500/20 focus:bg-white outline-none text-sm transition-all"
-                autoFocus
-              />
-              <div className="flex gap-2">
-                <button 
-                  onClick={handleSaveName} 
-                  className="px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-full transition-all text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed"
-                >
-                  Save
-                </button>
-                <button 
-                  onClick={handleCancelName} 
-                  className="px-4 py-2 bg-black/5 hover:bg-black/10 text-black rounded-full transition-all text-sm font-medium"
-                >
-                  Cancel
-                </button>
-              </div>
-            </div>
-          ) : (
-            <div className="relative p-4 bg-black/5 rounded-xl group hover:bg-black/10 transition-all">
-              <p className="text-sm font-medium text-black pr-8">{projectData.name || 'Unnamed Project'}</p>
-              <button
-                onClick={() => setIsEditingName(true)}
-                className="absolute right-3 top-1/2 -translate-y-1/2 p-1.5 text-black/40 hover:text-indigo-600 transition-colors"
-              >
-                {generateIcon("pen-411-1658238246.png", 18, "currentColor")}
-              </button>
-            </div>
-          )}
-        </div>
-
-        {/* Description */}
-        <div className="flex-1">
-          <label className="text-sm font-medium text-black/70 mb-2 block">Description</label>
-          
-          {isEditingDescription ? (
-            <div className="space-y-3">
-              <textarea
-                value={tempData.description}
-                onChange={(e) => setTempData((prev) => ({ ...prev, description: e.target.value }))}
-                rows={3}
-                placeholder="A modern web application built with..."
-                className="w-full px-4 py-2.5 bg-black/5 border border-transparent rounded-xl focus:ring-2 focus:ring-indigo-500/20 focus:border-indigo-500/20 focus:bg-white outline-none resize-none text-sm transition-all"
-                autoFocus
-              />
-              <div className="flex gap-2">
-                <button 
-                  onClick={handleSaveDescription} 
-                  className="px-4 py-2 bg-indigo-600 hover:bg-indigo-700 text-white rounded-full transition-all text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed"
-                >
-                  Save
-                </button>
-                <button 
-                  onClick={handleCancelDescription} 
-                  className="px-4 py-2 bg-black/5 hover:bg-black/10 text-black rounded-full transition-all text-sm font-medium"
-                >
-                  Cancel
-                </button>
-              </div>
-            </div>
-          ) : (
-            <div className="relative p-4 bg-black/5 rounded-xl group hover:bg-black/10 transition-all">
-              <p className="text-sm text-black/70 pr-8">
-                {projectData.description || 'No description provided'}
-              </p>
-              <button
-                onClick={() => setIsEditingDescription(true)}
-                className="absolute right-3 top-3 p-1.5 text-black/40 hover:text-indigo-600 transition-colors"
-              >
-                {generateIcon("pen-411-1658238246.png", 18, "currentColor")}
-              </button>
-            </div>
-          )}
-        </div>
-      </div>
-    </div>
-  );
-};

package/apps/dashboard/src/app/(dashboard)/projects/[id]/components/general/ProjectInfo.tsx

@@ -1,58 +0,0 @@
-
-import React from "react";
-import { Activity, GitBranch, Calendar, Hash, Sparkles, Info } from "lucide-react";
-import { generateIcon } from "@/utils/icons";
-import { useProjectSettings } from "@/context/ProjectSettingsContext";
-import { formatDate } from "@/utils/date";
-import { useToast } from "@/context/ToastContext";
-
-export const ProjectInfo: React.FC = () => {
-  const { projectData } = useProjectSettings();
-  const { showToast } = useToast();
-  const handleEditWithBlurs = () => {
-    showToast('Editing with Blurs is not available yet', 'success', 'Coming Soon');
-  };
-
-  return (
-    <>
-      {/* Project Metadata - Compact */}
-      <div className="bg-white rounded-[20px] border border-black/5 p-5">
-        <div className="flex items-center gap-2 mb-4">
-          {generateIcon('qr%20scan-120-1658435460.png', 24, 'rgb(79, 70, 229)')}
-          <h3 className="text-base font-semibold text-black">Project Info</h3>
-        </div>
-        <div className="space-y-3">
-          <div className="flex items-center justify-between">
-            <p className="text-xs text-black/50">Project ID</p>
-            <p className="text-xs text-black font-medium font-mono">{projectData.id?.substring(0, 8)}</p>
-          </div>
-          <div className="flex items-center justify-between">
-            <p className="text-xs text-black/50">Branch</p>
-            <p className="text-xs text-black font-medium">{projectData.branch || 'main'}</p>
-          </div>
-          <div className="flex items-center justify-between">
-            <p className="text-xs text-black/50">Last Deploy</p>
-            <p className="text-xs text-black font-medium">{formatDate(projectData.last_deployed)}</p>
-          </div>
-          <div className="flex items-center justify-between">
-            <p className="text-xs text-black/50">Framework</p>
-            <p className="text-xs text-black font-medium">{projectData.framework || 'Unknown'}</p>
-          </div>
-        </div>
-      </div>
-
-      {/* AI Assistant - Simplified */}
-      <div className="bg-white rounded-[20px] border border-black/5 p-5">
-        <div className="flex items-center gap-2 mb-4">
-          {generateIcon('star-103-1687505465.png', 24, 'rgb(79, 70, 229)')}
-          <h3 className="text-base font-semibold text-black">AI Assistant</h3>
-        </div>
-        <p className="text-xs text-black/40 mb-4">Powered by Blurs</p>
-        <button onClick={handleEditWithBlurs} className="w-full px-4 py-2.5 bg-black text-white rounded-full font-medium text-sm hover:bg-gray-900 transition-all hover:shadow-md flex items-center justify-center gap-2">
-          <Sparkles className="w-4 h-4" />
-          Edit with Blurs
-        </button>
-      </div>
-    </>
-  );
-};

package/apps/dashboard/src/app/(dashboard)/projects/[id]/components/general/SkeletonLoader.tsx

@@ -1,170 +0,0 @@
-import React from "react";
-
-// Fixed heights for skeleton bars to avoid hydration mismatches
-const SKELETON_BAR_HEIGHTS = [
-  45, 62, 38, 71, 55, 42, 68, 49, 75, 33, 
-  58, 44, 66, 52, 39, 73, 47, 61, 35, 69, 
-  51, 43, 64, 56
-];
-
-export const TrafficChartSkeleton = () => {
-  return (
-    <div className="bg-white rounded-2xl border border-gray-200 p-6 h-[320px] flex flex-col animate-pulse">
-      <div className="flex items-center justify-between mb-6">
-        <div className="flex items-center gap-3">
-          <div className="w-12 h-12 rounded-2xl bg-gray-200/50"></div>
-          <div>
-            <div className="h-6 w-40 bg-gray-200/50 rounded-2xl mb-2"></div>
-            <div className="h-4 w-32 bg-gray-200/30 rounded-2xl"></div>
-          </div>
-        </div>
-        <div className="flex items-center gap-4">
-          <div className="h-10 w-40 bg-gray-200/50 rounded-2xl"></div>
-          <div className="h-5 w-20 bg-gray-200/30 rounded-2xl"></div>
-        </div>
-      </div>
-      <div className="flex-1 flex items-end gap-1.5">
-        {SKELETON_BAR_HEIGHTS.map((height, i) => (
-          <div
-            key={i}
-            className="flex-1 bg-gray-200/50 rounded-t-2xl"
-            style={{ height: `${height}%` }}
-          ></div>
-        ))}
-      </div>
-      <div className="flex justify-between mt-3">
-        {Array.from({ length: 6 }).map((_, i) => (
-          <div key={i} className="h-3 w-10 bg-gray-200/30 rounded-2xl"></div>
-        ))}
-      </div>
-    </div>
-  );
-};
-
-export const TopPathsSkeleton = () => {
-  return (
-    <div className="bg-white rounded-2xl border border-gray-200 p-6 h-[320px] flex flex-col animate-pulse">
-      <div className="flex items-center justify-between mb-5">
-        <div className="flex items-center gap-3">
-          <div className="w-12 h-12 rounded-2xl bg-gray-200/50"></div>
-          <div className="h-6 w-32 bg-gray-200/50 rounded-2xl"></div>
-        </div>
-        <div className="h-5 w-20 bg-gray-200/30 rounded-2xl"></div>
-      </div>
-      <div className="space-y-5 flex-1">
-        {Array.from({ length: 3 }).map((_, i) => (
-          <div key={i} className="space-y-2">
-            <div className="flex items-center justify-between mb-2">
-              <div className="h-4 w-32 bg-gray-200/50 rounded-2xl"></div>
-              <div className="h-4 w-16 bg-gray-200/30 rounded-2xl"></div>
-            </div>
-            <div className="w-full h-2.5 bg-gray-200/50 rounded-2xl"></div>
-            <div className="h-3 w-20 bg-gray-200/30 rounded-2xl"></div>
-          </div>
-        ))}
-      </div>
-    </div>
-  );
-};
-
-export const StatsCardsSkeleton = () => {
-  return (
-    <div className="grid grid-cols-4 gap-4 h-[100px]">
-      {Array.from({ length: 4 }).map((_, i) => (
-        <div
-          key={i}
-          className="bg-white border border-gray-200 rounded-2xl p-4 h-full flex items-center animate-pulse"
-        >
-          <div className="flex items-center gap-3 w-full">
-            <div className="w-12 h-12 rounded-2xl bg-gray-200/50 flex-shrink-0"></div>
-            <div className="flex-1 min-w-0">
-              <div className="h-6 w-20 bg-gray-200/50 rounded-2xl mb-2"></div>
-              <div className="h-4 w-24 bg-gray-200/30 rounded-2xl mb-1"></div>
-              <div className="h-3 w-20 bg-gray-200/30 rounded-2xl"></div>
-            </div>
-          </div>
-        </div>
-      ))}
-    </div>
-  );
-};
-
-export const ProductionUrlSkeleton = () => {
-  return (
-    <div className="bg-gradient-to-br from-gray-50 to-gray-100 rounded-2xl border border-gray-200 p-6 h-[100px] flex items-center animate-pulse">
-      <div className="flex items-center gap-4 flex-1">
-        <div className="w-12 h-12 bg-gray-200/50 rounded-2xl flex-shrink-0"></div>
-        <div className="flex-1 min-w-0">
-          <div className="h-4 w-32 bg-gray-200/30 rounded-2xl mb-2"></div>
-          <div className="h-5 w-40 bg-gray-200/50 rounded-2xl"></div>
-        </div>
-      </div>
-    </div>
-  );
-};
-
-export const ProjectIdentitySkeleton = () => {
-  return (
-    <div className="bg-white rounded-2xl border border-gray-200 overflow-hidden animate-pulse">
-      <div className="bg-gray-50 px-6 py-5 border-b border-gray-200 flex items-center gap-3">
-        <div className="w-12 h-12 rounded-2xl bg-gray-200/50"></div>
-        <div>
-          <div className="h-6 w-40 bg-gray-200/50 rounded-2xl mb-2"></div>
-          <div className="h-4 w-48 bg-gray-200/30 rounded-2xl"></div>
-        </div>
-      </div>
-      
-      <div className="p-6 space-y-5">
-        {Array.from({ length: 3 }).map((_, i) => (
-          <div key={i}>
-            <div className="flex items-center justify-between mb-3">
-              <div className="h-5 w-32 bg-gray-200/50 rounded-2xl"></div>
-              <div className="h-4 w-16 bg-gray-200/30 rounded-2xl"></div>
-            </div>
-            <div className="p-4 bg-gray-50 rounded-2xl">
-              <div className="h-5 w-full bg-gray-200/50 rounded-2xl"></div>
-            </div>
-          </div>
-        ))}
-      </div>
-    </div>
-  );
-};
-
-export const ProjectInfoSkeleton = () => {
-  return (
-    <>
-      <div className="bg-white rounded-2xl border border-gray-200 p-6 animate-pulse">
-        <div className="flex items-center gap-3 mb-5">
-          <div className="w-12 h-12 rounded-2xl bg-gray-200/50"></div>
-          <div className="h-6 w-36 bg-gray-200/50 rounded-2xl"></div>
-        </div>
-        <div className="space-y-4">
-          {Array.from({ length: 4 }).map((_, i) => (
-            <div key={i} className="flex items-center gap-4">
-              <div className="w-5 h-5 rounded-xl bg-gray-200/50"></div>
-              <div className="flex-1">
-                <div className="h-4 w-20 bg-gray-200/50 rounded-2xl mb-2"></div>
-                <div className="h-4 w-32 bg-gray-200/30 rounded-2xl"></div>
-              </div>
-            </div>
-          ))}
-        </div>
-      </div>
-
-      <div className="bg-gradient-to-br from-gray-50 to-gray-100 rounded-2xl border border-gray-200 p-6 animate-pulse">
-        <div className="flex items-start justify-between mb-4">
-          <div className="flex items-center gap-3">
-            <div className="w-12 h-12 bg-gray-200/50 rounded-2xl"></div>
-            <div>
-              <div className="h-5 w-32 bg-gray-200/50 rounded-2xl mb-2"></div>
-              <div className="h-4 w-36 bg-gray-200/30 rounded-2xl"></div>
-            </div>
-          </div>
-        </div>
-        <div className="w-full h-12 bg-gray-200/50 rounded-2xl"></div>
-        <div className="h-4 w-40 bg-gray-200/30 rounded-2xl mt-4 mx-auto"></div>
-      </div>
-    </>
-  );
-};

package/apps/dashboard/src/app/(dashboard)/projects/[id]/components/general/StatsCards.tsx

@@ -1,33 +0,0 @@
-import React from "react";
-import { generateIcon } from "@/utils/icons";
-
-interface Props {
-  stats: any[];
-}
-
-export const StatsCards: React.FC<Props> = ({ stats }) => {
-  return (
-    <div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
-      {stats.map((stat) => {
-        return (
-          <div key={stat.label} className="bg-white border border-black/5 rounded-[20px] hover:shadow-md transition-all p-4">
-            <div className="flex flex-col">
-              <div className="flex items-center gap-2 mb-3">
-                {generateIcon(stat.icon, 24, 'rgb(79, 70, 229)')}
-                <p className="text-xs font-medium text-black/50">{stat.label}</p>
-              </div>
-              <p className="text-2xl font-semibold text-black mb-1">
-                {stat.value}
-              </p>
-              {stat.subtext && (
-                <p className="text-xs text-black/40 font-normal">
-                  {stat.subtext}
-                </p>
-              )}
-            </div>
-          </div>
-        );
-      })}
-    </div>
-  );
-};

package/apps/dashboard/src/app/(dashboard)/projects/[id]/components/general/TopPaths.tsx

@@ -1,56 +0,0 @@
-"use client";
-import React, { useState } from "react";
-import { generateIcon } from "@/utils/icons";
-
-interface PathData {
-  path: string;
-  count: number;
-  percentage: string;
-}
-
-interface Props {
-  paths: PathData[];
-}
-
-export const TopPaths: React.FC<Props> = ({ paths }) => {
-  const [showAll, setShowAll] = useState(false);
-  
-  const displayedPaths = showAll ? paths : paths.slice(0, 5);
-  const hasMorePaths = paths.length > 5;
-
-  return (
-    <div className="bg-white rounded-[20px] border border-black/5 p-5">
-      <div className="flex items-center justify-between mb-5">
-        <div className="flex items-center gap-2">
-          {generateIcon('trend%20up-79-1681196106.png', 24, 'rgb(79, 70, 229)')}
-          <h3 className="text-base font-semibold text-black">Top Paths</h3>
-        </div>
-        {hasMorePaths && (
-          <button
-            onClick={() => setShowAll(!showAll)}
-            className="text-xs font-medium text-indigo-600 hover:text-indigo-700 transition-colors"
-          >
-            {showAll ? 'Show Less' : `+${paths.length - 5}`}
-          </button>
-        )}
-      </div>
-      <div className="space-y-4">
-        {displayedPaths.map((path, idx) => (
-          <div key={idx}>
-            <div className="flex items-center justify-between mb-2">
-              <span className="text-xs text-black/70 font-medium truncate pr-2">{path.path}</span>
-              <span className="text-xs font-medium text-indigo-600">{path.percentage}%</span>
-            </div>
-            <div className="w-full bg-black/5 rounded-full h-2 overflow-hidden">
-              <div 
-                className="h-full bg-indigo-600 rounded-full transition-all"
-                style={{ width: `${path.percentage}%` }}
-              ></div>
-            </div>
-            <p className="text-xs text-black/40 mt-1">{path.count} requests</p>
-          </div>
-        ))}
-      </div>
-    </div>
-  );
-};

package/apps/dashboard/src/app/(dashboard)/projects/[id]/components/general/TrafficChart.tsx

@@ -1,157 +0,0 @@
-"use client";
-import React, { useState } from "react";
-import { BarChart3, TrendingUp } from "lucide-react";
-import { generateIcon } from "@/utils/icons";
-import { SlidingToggle } from "@/components/ui/SlidingToggle";
-
-interface TrafficData {
-  hour: number;
-  requests: number;
-}
-
-interface Props {
-  trafficData: TrafficData[];
-  isLoading: boolean;
-  dateRange?: string;
-  totalRequests?: number;
-}
-
-export const TrafficChart: React.FC<Props> = ({
-  trafficData,
-  isLoading,
-  dateRange,
-  totalRequests,
-}) => {
-  const [chartType, setChartType] = useState<'bar' | 'area'>('area');
-  const maxRequests = Math.max(...trafficData.map(d => d.requests), 1);
-  if(trafficData.length === 0) {
-    trafficData = Array.from({ length: 24 }, (_, i) => ({
-      hour: i,
-      requests: 0,
-    }));
-  }
-
-  return (
-    <div className="bg-white rounded-[20px] border border-black/5 p-4 sm:p-6 h-[280px] sm:h-[320px] flex flex-col">
-      <div className="flex items-center justify-between gap-2 sm:gap-0 mb-4 sm:mb-5">
-        <div className="flex items-center gap-2 sm:gap-3 flex-1 min-w-0">
-          {generateIcon('chart%204%20line-5-1666004410.png', 24, 'rgb(79, 70, 229)')}
-          <div className="min-w-0">
-            <h3 className="text-sm sm:text-lg font-semibold text-black truncate">Traffic Overview</h3>
-            <p className="text-[10px] sm:text-sm text-black/40 truncate">{dateRange || 'Last 24 hours'}</p>
-          </div>
-        </div>
-        <div className="flex items-center gap-3 flex-shrink-0">
-          {/* Chart Type Selector */}
-          <SlidingToggle
-            options={[
-              {
-                value: 'bar',
-                icon: <BarChart3 className="w-3.5 h-3.5 sm:w-4 sm:h-4" />,
-                label: 'Bar',
-              },
-              {
-                value: 'area',
-                icon: <TrendingUp className="w-3.5 h-3.5 sm:w-4 sm:h-4" />,
-                label: 'Area',
-              },
-            ]}
-            value={chartType}
-            onChange={(value) => setChartType(value as 'bar' | 'area')}
-            variant="rounded"
-            selectedBg="bg-indigo-600"
-            selectedTextColor="text-white"
-            unselectedTextColor="text-black/60"
-            backgroundColor="bg-white"
-            size="sm"
-          />
-         
-        </div>
-      </div>
-
-      {/* Traffic Chart */}
-      {isLoading ? (
-        <div className="flex items-center justify-center flex-1">
-          <div className="text-sm text-gray-400">Loading analytics...</div>
-        </div>
-      ) : (
-        <div className="flex-1 flex flex-col">
-          <div className="relative flex-1">
-            <svg className="absolute inset-0 w-full h-full" viewBox="0 0 1000 160" preserveAspectRatio="none">
-              <defs>
-                <linearGradient id="trafficGradient" x1="0%" y1="0%" x2="0%" y2="100%">
-                  <stop offset={`${chartType == 'bar' ? 100 : 20}%`} stopColor="rgb(99, 102, 241)" stopOpacity="0.3" />
-                  <stop offset="100%" stopColor="rgb(99, 102, 241)" stopOpacity="0.1" />
-                </linearGradient>
-              </defs>
-
-              {chartType === 'bar' && (
-                /* Bar Chart */
-                <>
-                  {trafficData.map((d, i) => {
-                    const containerWidth = 1000;
-                    const containerHeight = 160;
-                    const barWidth = containerWidth / trafficData.length * 0.8;
-                    const x = (i / trafficData.length) * containerWidth + barWidth * 0.1;
-                    const height = (d.requests / maxRequests) * 140;
-                    const y = containerHeight - height;
-
-                    return (
-                      <rect
-                        key={i}
-                        x={x}
-                        y={y}
-                        width={barWidth}
-                        height={height}
-                        fill="url(#trafficGradient)"
-                        rx="4"
-                        ry="4"
-                      />
-                    );
-                  })}
-                </>
-              )}
-
-              {chartType === 'area' && (
-                /* Area Chart with Border Line */
-                <>
-                  {/* Area Fill */}
-                  <path
-                    d={`M 0 150 ${trafficData.map((d, i) => {
-                      const x = (i / (trafficData.length - 1)) * 1000;
-                      const baseHeight = 110; // Raised baseline for zero state
-                      const maxHeight = 110; // Maximum height for visualization
-                      const y = baseHeight - (d.requests / maxRequests) * maxHeight;
-                      return `L ${x} ${y}`;
-                    }).join(' ')} L 1000 150 Z`}
-                    fill="url(#trafficGradient)"
-                  />
-                  {/* Top Border Line - More Visible */}
-                  <path
-                    d={`M ${trafficData.map((d, i) => {
-                      const x = (i / (trafficData.length - 1)) * 1000;
-                      const baseHeight = 0;
-                      const maxHeight = 130;
-                      const y = baseHeight - (d.requests / maxRequests) * maxHeight;
-                      return `${i === 0 ? 'M' : 'L'} ${x} ${y}`;
-                    }).join(' ')}`}
-                    fill="none"
-                    stroke="rgb(99, 102, 241)"
-                    strokeWidth="0.5"
-                  />
-                </>
-              )}
-            </svg>
-          </div>
-
-          {/* Hour Labels */}
-          <div className="flex items-center justify-between mt-2 text-[9px] sm:text-[10px] text-gray-500">
-            {trafficData.filter((_, i) => i % 4 === 0).map((d, i) => (
-              <span key={i}>{d.hour}:00</span>
-            ))}
-          </div>
-        </div>
-      )}
-    </div>
-  );
-};

package/apps/dashboard/src/app/(dashboard)/projects/[id]/components/general/index.ts

@@ -1,14 +0,0 @@
-export { TrafficChart } from './TrafficChart';
-export { TopPaths } from './TopPaths';
-export { StatsCards } from './StatsCards';
-export { ProductionUrl } from './ProductionUrl';
-export { ProjectIdentity } from './ProjectIdentity';
-export { ProjectInfo } from './ProjectInfo';
-export {
-  TrafficChartSkeleton,
-  TopPathsSkeleton,
-  StatsCardsSkeleton,
-  ProductionUrlSkeleton,
-  ProjectIdentitySkeleton,
-  ProjectInfoSkeleton,
-} from './SkeletonLoader';