openship 0.1.0 → 0.1.1

package/apps/dashboard/src/utils/date.ts

@@ -0,0 +1,121 @@
+/**
+ * Utility functions for handling dates consistently across the application
+ * This will help when connecting to the API
+ */
+
+/**
+ * Safely parses a date string into a Date object
+ * @param dateString The date string to parse
+ * @returns A valid Date object or null if invalid
+ */
+export function parseDate(dateString: string | null | undefined): Date | null {
+  if (!dateString) return null;
+  
+  try {
+    const date = new Date(dateString);
+    return isNaN(date.getTime()) ? null : date;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Formats a date for display with a fallback for invalid dates
+ * @param dateString The date string to format
+ * @param options DateTimeFormat options
+ * @param fallback Fallback string for invalid dates
+ * @returns Formatted date string or fallback
+ */
+export function formatDate(
+  dateString: string | null | undefined, 
+  options: Intl.DateTimeFormatOptions = { 
+    year: 'numeric', 
+    month: 'short', 
+    day: 'numeric' 
+  },
+  fallback: string = 'N/A',
+  getSince: boolean = false
+): string {
+  const date = parseDate(dateString);
+  if (!date) return fallback;
+
+  if (getSince) {
+    const now = new Date();
+    const diff = now.getTime() - date.getTime();
+
+    const seconds = Math.floor(diff / 1000);
+    const minutes = Math.floor(seconds / 60);
+    const hours = Math.floor(minutes / 60);
+    const days = Math.floor(hours / 24);
+    const months = Math.floor(days / 30); // Approximate month length
+    const years = Math.floor(months / 12); // Approximate year length
+
+    if (years > 0) {
+      return `${years} year${years > 1 ? 's' : ''} ago`;
+    } else if (months > 0) {
+      return `${months} month${months > 1 ? 's' : ''} ago`;
+    } else if (days > 0) {
+      return `${days} day${days > 1 ? 's' : ''} ago`;
+    } else if (hours > 0) {
+      return `${hours} hour${hours > 1 ? 's' : ''} ago`;
+    } else if (minutes > 0) {
+      return `${minutes} minute${minutes > 1 ? 's' : ''} ago`;
+    } else {
+      return `${seconds} second${seconds > 1 ? 's' : ''} ago`;
+    }
+  }
+
+  return new Intl.DateTimeFormat('en-US', options).format(date);
+}
+
+
+/**
+ * Calculates days difference between a date and today
+ * @param dateString The date string to compare with today
+ * @returns Number of days difference or null if invalid
+ */
+export function getDaysDifference(dateString: string | null | undefined): number | null {
+  const date = parseDate(dateString);
+  if (!date) return null;
+  
+  const today = new Date();
+  const diffTime = date.getTime() - today.getTime();
+  return Math.ceil(diffTime / (1000 * 60 * 60 * 24));
+}
+
+/**
+ * Formats a date showing relative time for near dates
+ * @param dateString The date to format
+ * @param threshold Days threshold to show relative time instead of date
+ * @returns Formatted string
+ */
+export function formatRelativeDate(
+  dateString: string | null | undefined, 
+  threshold: number = 30
+): string {
+  const days = getDaysDifference(dateString);
+  
+  if (days === null) return 'Invalid date';
+  
+  if (days < 0) {
+    return 'Expired';
+  } else if (days === 0) {
+    return 'Today';
+  } else if (days === 1) {
+    return 'Tomorrow';
+  } else if (days <= threshold) {
+    return `In ${days} days`;
+  } else {
+    return formatDate(dateString);
+  }
+}
+
+/**
+ * Serializes a Date object to ISO string format for API requests
+ * @param date The date to serialize
+ * @returns ISO string or null if invalid
+ */
+export function serializeDate(date: Date | null | undefined): string | null {
+  if (!date || isNaN(date.getTime())) return null;
+  return date.toISOString();
+} 

package/apps/dashboard/src/utils/deployment.ts

@@ -0,0 +1,128 @@
+import type { Deployment } from "@/components/import-project/types";
+
+/**
+ * Formats a date to a human-readable "time ago" string
+ */
+export const formatDistanceToNow = (date: Date): string => {
+  const now = new Date();
+  const diffInSeconds = Math.floor((now.getTime() - date.getTime()) / 1000);
+
+  if (diffInSeconds < 60) return `${diffInSeconds}s ago`;
+  if (diffInSeconds < 3600) return `${Math.floor(diffInSeconds / 60)}m ago`;
+  if (diffInSeconds < 86400) return `${Math.floor(diffInSeconds / 3600)}h ago`;
+  if (diffInSeconds < 2592000) return `${Math.floor(diffInSeconds / 86400)}d ago`;
+  if (diffInSeconds < 31536000) return `${Math.floor(diffInSeconds / 2592000)}mo ago`;
+  return `${Math.floor(diffInSeconds / 31536000)}y ago`;
+};
+
+/**
+ * Formats build time in seconds to a readable string
+ */
+export const formatBuildTime = (seconds: number | null): string | null => {
+  if (!seconds) return null;
+  const mins = Math.floor(seconds / 60);
+  const secs = seconds % 60;
+  return mins > 0 ? `${mins}m ${secs}s` : `${secs}s`;
+};
+
+/**
+ * Gets the status configuration for a deployment
+ */
+export const getStatusConfig = (status: string) => {
+  switch (status) {
+    case "success":
+      return {
+        icon: 'checkmark-72-1658234612.png',
+        color: "var(--color-emerald-500)",
+        bgColor: "bg-emerald-50",
+        borderColor: "border-emerald-200",
+        label: "Deployed",
+      };
+    case "failed":
+      return {
+        icon: 'close remove-802-1662363936.png',
+        color: "var(--color-red-500)",
+        bgColor: "bg-red-50",
+        borderColor: "border-red-200",
+        label: "Failed",
+      };
+    case "canceled":
+      return {
+        icon: 'close%20circle-73-1658234612.png',
+        color: "var(--color-gray-600)",
+        bgColor: "bg-gray-50",
+        borderColor: "border-gray-200",
+        label: "Canceled",
+      };
+    case "building":
+      return {
+        icon: 'loading-51-1663582768.png',
+        color: "var(--color-blue-600)",
+        bgColor: "bg-blue-50",
+        borderColor: "border-blue-200",
+        label: "Building",
+      };
+    default:
+      return {
+        icon: 'circle%20clock-39-1658435834.png',
+        color: "var(--color-gray-600)",
+        bgColor: "bg-gray-50",
+        borderColor: "border-gray-200",
+        label: "Pending",
+      };
+  }
+};
+
+/**
+ * Sorts deployments by creation date (most recent first)
+ */
+export const sortDeploymentsByDate = (deployments: Deployment[]): Deployment[] => {
+  return [...deployments].sort(
+    (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
+  );
+};
+
+/**
+ * Filters deployments based on multiple criteria
+ */
+export const filterDeployments = (
+  deployments: Deployment[],
+  filters: {
+    status?: "all" | "success" | "failed" | "building" | "pending" | "canceled";
+    searchQuery?: string;
+    projectId?: string | "all";
+  }
+): Deployment[] => {
+  const { status = "all", searchQuery = "", projectId = "all" } = filters;
+
+  return deployments.filter((deployment) => {
+    // Handle both "canceled" and "cancelled" spellings
+    const deploymentStatus = deployment.status === 'cancelled' ? 'canceled' : deployment.status;
+    const matchesStatus = status === "all" || deploymentStatus === status;
+    const matchesSearch =
+      !searchQuery ||
+      deployment.commit.message.toLowerCase().includes(searchQuery.toLowerCase()) ||
+      deployment.commit.hash.toLowerCase().includes(searchQuery.toLowerCase()) ||
+      deployment.commit.author.toLowerCase().includes(searchQuery.toLowerCase()) ||
+      deployment.projectName?.toLowerCase().includes(searchQuery.toLowerCase());
+    const matchesProject = projectId === "all" || deployment.projectId === projectId;
+
+    return matchesStatus && matchesSearch && matchesProject;
+  });
+};
+
+/**
+ * Calculates deployment statistics
+ */
+export const calculateDeploymentStats = (deployments: Deployment[]) => {
+  return {
+    total: deployments.length,
+    success: deployments.filter((d) => d.status === "success").length,
+    failed: deployments.filter((d) => d.status === "failed").length,
+    building: deployments.filter((d) => d.status === "building").length,
+    pending: deployments.filter((d) => d.status === "pending").length,
+    // Handle both "canceled" and "cancelled" spellings
+    canceled: deployments.filter((d) => d.status === "canceled" || d.status === "cancelled").length,
+  };
+};
+

package/apps/dashboard/src/utils/deploymentPhaseDetector.ts

@@ -0,0 +1,232 @@
+export type DeploymentPhase = "cloning" | "installing" | "building" | "deploying" | "ready";
+
+export interface PhaseInfo {
+  phase: DeploymentPhase;
+  progress: number;
+  stepIndex: number;
+}
+
+export interface BuildLog {
+  type: "info" | "success" | "error";
+  text: string;
+  time: string;
+}
+
+export interface SSEMessage {
+  type: string;
+  data: string;
+  timestamp: string;
+}
+
+/**
+ * Analyzes a log message and determines the current deployment phase and progress
+ */
+export function detectPhase(logText: string): PhaseInfo {
+  const lowerText = logText.toLowerCase();
+  
+  // Check for explicit phase markers (---PHASE: xxx---)
+  const phaseMarker = logText.match(/---PHASE:\s*(\w+)---/i);
+  if (phaseMarker) {
+    const phaseName = phaseMarker[1].toLowerCase();
+    return getPhaseInfoFromName(phaseName);
+  }
+  
+  // Phase detection patterns
+  const patterns = {
+    cloning: [
+      /clon(ing|e)/i,
+      /git clone/i,
+      /fetch(ing)? repository/i,
+      /download(ing)? (from )?repository/i
+    ],
+    installing: [
+      /install(ing)? dependencies/i,
+      /npm install/i,
+      /yarn install/i,
+      /pnpm install/i,
+      /packages? installed/i,
+      /node_modules/i,
+      /dependencies/i
+    ],
+    building: [
+      /build(ing)?/i,
+      /compil(ing|e)/i,
+      /bundl(ing|e)/i,
+      /optimiz(ing|e)/i,
+      /webpack/i,
+      /production build/i
+    ],
+    deploying: [
+      /deploy(ing)?/i,
+      /upload(ing)?/i,
+      /publishing/i,
+      /edge network/i,
+      /global regions/i,
+      /distribution/i
+    ],
+    ready: [
+      /deployment (complete|ready|successful)/i,
+      /successfully deployed/i,
+      /live and running/i,
+      /🎉/,
+      /deployment ready/i,
+      /done/i
+    ]
+  };
+
+  // Detect phase
+  let phase: DeploymentPhase = "cloning";
+  let stepIndex = 0;
+
+  if (patterns.ready.some(p => p.test(lowerText))) {
+    phase = "ready";
+    stepIndex = 4;
+  } else if (patterns.deploying.some(p => p.test(lowerText))) {
+    phase = "deploying";
+    stepIndex = 3;
+  } else if (patterns.building.some(p => p.test(lowerText))) {
+    phase = "building";
+    stepIndex = 2;
+  } else if (patterns.installing.some(p => p.test(lowerText))) {
+    phase = "installing";
+    stepIndex = 1;
+  } else if (patterns.cloning.some(p => p.test(lowerText))) {
+    phase = "cloning";
+    stepIndex = 0;
+  }
+
+  // Calculate progress based on phase
+  const progress = calculateProgress(phase, lowerText);
+
+  return { phase, progress, stepIndex };
+}
+
+/**
+ * Maps phase name to PhaseInfo
+ */
+function getPhaseInfoFromName(phaseName: string): PhaseInfo {
+  const phaseMap: Record<string, { phase: DeploymentPhase; stepIndex: number; progress: number }> = {
+    clone: { phase: "cloning", stepIndex: 0, progress: 5 },
+    cloning: { phase: "cloning", stepIndex: 0, progress: 5 },
+    install: { phase: "installing", stepIndex: 1, progress: 25 },
+    installing: { phase: "installing", stepIndex: 1, progress: 25 },
+    dependencies: { phase: "installing", stepIndex: 1, progress: 25 },
+    build: { phase: "building", stepIndex: 2, progress: 50 },
+    building: { phase: "building", stepIndex: 2, progress: 50 },
+    deploy: { phase: "deploying", stepIndex: 3, progress: 75 },
+    deploying: { phase: "deploying", stepIndex: 3, progress: 75 },
+    upload: { phase: "deploying", stepIndex: 3, progress: 75 },
+    ready: { phase: "ready", stepIndex: 4, progress: 100 },
+    done: { phase: "ready", stepIndex: 4, progress: 100 },
+    complete: { phase: "ready", stepIndex: 4, progress: 100 },
+  };
+
+  return phaseMap[phaseName] || { phase: "cloning", stepIndex: 0, progress: 0 };
+}
+
+/**
+ * Calculates progress percentage based on phase and log content
+ */
+function calculateProgress(phase: DeploymentPhase, logText: string): number {
+  const baseProgress = {
+    cloning: 0,
+    installing: 25,
+    building: 50,
+    deploying: 75,
+    ready: 100
+  };
+
+  const baseValue = baseProgress[phase];
+
+  // Try to extract percentage from log text
+  const percentMatch = logText.match(/(\d+)%/);
+  if (percentMatch) {
+    const extractedPercent = parseInt(percentMatch[1]);
+    // Scale the extracted percentage within the phase range
+    const phaseRange = 25; // Each phase is roughly 25% of total
+    return baseValue + (extractedPercent / 100) * phaseRange;
+  }
+
+  // Check for completion indicators
+  if (logText.includes('✓') || logText.includes('complete') || logText.includes('success')) {
+    return Math.min(baseValue + 20, 100);
+  }
+
+  // Default to base progress
+  return baseValue;
+}
+
+/**
+ * Converts raw log text to BuildLog format
+ */
+export function parseLogEntry(text: string, timestamp: string, startTime: number): BuildLog {
+  const lowerText = text.toLowerCase();
+  
+  // Skip phase markers in the log display
+  if (text.match(/---PHASE:\s*\w+---/i)) {
+    // Return a special marker that can be filtered out if needed
+    const currentTime = Math.floor((new Date(timestamp).getTime() - startTime) / 1000);
+    const mins = Math.floor(currentTime / 60);
+    const secs = currentTime % 60;
+    const time = `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
+    
+    return { type: "info", text: "", time }; // Empty text to hide phase markers
+  }
+  
+  // Determine log type
+  let type: "info" | "success" | "error" = "info";
+  
+  if (
+    text.includes('✓') || 
+    lowerText.includes('success') || 
+    lowerText.includes('complete') ||
+    lowerText.includes('deployed') ||
+    lowerText.includes('done') ||
+    text.includes('🎉')
+  ) {
+    type = "success";
+  } else if (
+    lowerText.includes('error') || 
+    lowerText.includes('fail') || 
+    lowerText.includes('✗') ||
+    text.includes('❌')
+  ) {
+    type = "error";
+  }
+
+  // Calculate time from timestamp
+  const currentTime = Math.floor((new Date(timestamp).getTime() - startTime) / 1000);
+  const mins = Math.floor(currentTime / 60);
+  const secs = currentTime % 60;
+  const time = `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
+
+  // Clean up the text (remove extra whitespace, line breaks)
+  const cleanText = text.trim();
+
+  return { type, text: cleanText, time };
+}
+
+/**
+ * Aggregates phase information from multiple logs to determine overall state
+ */
+export function aggregatePhaseInfo(logs: BuildLog[]): PhaseInfo {
+  if (logs.length === 0) {
+    return { phase: "cloning", progress: 0, stepIndex: 0 };
+  }
+
+  // Get phase info from the last few logs to determine current phase
+  const recentLogs = logs.slice(-5);
+  let maxProgress = 0;
+  let currentPhase: PhaseInfo = { phase: "cloning", progress: 0, stepIndex: 0 };
+
+  for (const log of recentLogs) {
+    const phaseInfo = detectPhase(log.text);
+    if (phaseInfo.progress > maxProgress) {
+      maxProgress = phaseInfo.progress;
+      currentPhase = phaseInfo;
+    }
+  }
+
+  return currentPhase;
+}
+

package/apps/dashboard/src/utils/extToLang.js

@@ -0,0 +1,103 @@
+export const extToLangMap = {
+    'js': 'javascript',
+    'jsx': 'javascriptreact', 
+    'ts': 'typescript',
+    'tsx': 'typescriptreact',
+    'py': 'python',
+    'rb': 'ruby',
+    'php': 'php',
+    'java': 'java',
+    'c': 'c',
+    'cpp': 'cpp',
+    'cc': 'cpp',
+    'cxx': 'cpp',
+    'cs': 'csharp',
+    'go': 'go',
+    'rs': 'rust',
+    'swift': 'swift',
+    'css': 'css',
+    'scss': 'scss',
+    'sass': 'sass',
+    'html': 'html',
+    'htm': 'html',
+    'xml': 'xml',
+    'json': 'json',
+    'jsonc': 'jsonc',
+    'md': 'markdown',
+    'mdx': 'mdx',
+    'txt': 'plaintext',
+    'sql': 'sql',
+    'sh': 'shellscript',
+    'bash': 'shellscript',
+    'zsh': 'shellscript',
+    'ps1': 'powershell',
+    'vue': 'vue',
+    'svelte': 'svelte',
+    'dart': 'dart',
+    'lua': 'lua',
+    'r': 'r',
+    // Additional mappings from JSON languageIds
+    'astro': 'astro',
+    'clj': 'clojure',
+    'cljs': 'clojure',
+    'coffee': 'coffeescript',
+    'cr': 'crystal',
+    'ex': 'elixir',
+    'exs': 'elixir',
+    'elm': 'elm',
+    'erl': 'erlang',
+    'f': 'fortran',
+    'f90': 'fortran90',
+    'f95': 'fortran95',
+    'graphql': 'graphql',
+    'gql': 'graphql',
+    'hbs': 'handlebars',
+    'ha': 'hare',
+    'hs': 'haskell',
+    'hx': 'haxe',
+    'jl': 'julia',
+    'tex': 'tex',
+    'latex': 'latex',
+    'less': 'less',
+    'm': 'matlab',
+    'ml': 'ocaml',
+    'pl': 'perl',
+    'pro': 'prolog',
+    'pug': 'pug',
+    're': 'reason',
+    'rst': 'restructuredtext',
+    'styl': 'stylus',
+    'tf': 'terraform',
+    'toml': 'toml',
+    'yaml': 'yaml',
+    'yml': 'yaml',
+    // Missing important ones
+    'bat': 'bat',
+    'bib': 'bibtex',
+    'blade': 'blade',
+    'cu': 'cuda-cpp',
+    'd': 'd',
+    'diff': 'diff',
+    'patch': 'diff',
+    'fs': 'fsharp',
+    'groovy': 'groovy',
+    'haml': 'haml',
+    'ini': 'ini',
+    'jade': 'jade',
+    'mm': 'objective-cpp',
+    'objc': 'objective-c',
+    'pas': 'pascal',
+    'p6': 'perl6',
+    'cshtml': 'razor',
+    'res': 'rescript',
+    'shader': 'shaderlab',
+    'slim': 'slim',
+    'vb': 'vb',
+    'xsl': 'xsl',
+    // Additional missing ones
+    'dockerfile': 'dockerfile',
+    'makefile': 'makefile',
+    'make': 'makefile',
+    'todo': 'todo',
+    'abap': 'abap'
+}

package/apps/dashboard/src/utils/github.ts

@@ -0,0 +1,62 @@
+import { githubApi } from "@/lib/api";
+import { openAuthWindow } from "@/utils/authWindow";
+
+/**
+ * @deprecated Use `openAuthWindow` from `@/utils/authWindow` directly.
+ */
+export const initAuthWindow = async (url: string, callback: () => void, windowRef?: Window | null) => {
+  // Legacy wrapper — delegates to the shared middleware.
+  const handle = openAuthWindow(url);
+  handle.onClose(() => {
+    setTimeout(callback, 1000);
+  });
+};
+
+export const handleConnectGithub = async (
+  checkGithubConnection: () => void,
+  showToast: (message: string, type: "success" | "error") => void,
+  setLoading: (loading: boolean) => void
+): Promise<void> => {
+  try {
+    setLoading(true);
+
+    const res = await githubApi.connect();
+
+    // Already connected — just refresh
+    if (res?.connected) {
+      setLoading(false);
+      checkGithubConnection();
+      return;
+    }
+
+    switch (res?.flow) {
+      case "redirect": {
+        const handle = openAuthWindow();
+        handle.navigate(res.url);
+        handle.onClose(() => {
+          setLoading(false);
+          checkGithubConnection();
+        });
+        return;
+      }
+
+      case "device_code":
+        // Device flow is handled by GitHubContext; toast for standalone callers
+        showToast(`Enter code ${res.userCode} at ${res.verificationUri}`, "success");
+        setLoading(false);
+        return;
+
+      case "terminal":
+        showToast(res.message ?? res.command, "error");
+        setLoading(false);
+        return;
+
+      default:
+        setLoading(false);
+    }
+  } catch (error) {
+    console.error("Failed to connect to GitHub:", error);
+    showToast("Failed to connect to GitHub", "error");
+    setLoading(false);
+  }
+};

package/apps/dashboard/src/utils/icons.js

@@ -0,0 +1,46 @@
+const config = {
+
+}
+
+const rawIcons = {
+
+}
+
+export const generateIcon = (name, size, color = '#000', style = {}, isRaw = false) => {
+    // Handle null/undefined name
+    if (!name) {
+        return null;
+    }
+
+    if(isRaw) {
+        return <img src={name?.replace(/ /g, '%20')} alt={name} style={{
+            width: size,
+            height: size,
+            objectFit: 'contain',
+            ...style
+        }} />
+    }
+
+    let url = `https://cdn.oblien.com/static/png-icons/${config[name]?.replace(/ /g, '%20') || name?.replace(/ /g, '%20')}`
+    
+    if(name.startsWith('http')) {
+        url = name
+    }
+
+    return <div style={{
+        maskImage: `url('${url}')`,
+        maskSize: 'contain',
+        maskRepeat: 'no-repeat',
+        maskPosition: 'center',
+        WebkitMaskSize: 'contain',
+        WebkitMaskRepeat: 'no-repeat',
+        WebkitMaskPosition: 'center',
+        width: size,
+        height: size,
+        backgroundColor: color,
+        ...style
+    }} />
+}
+
+
+export default generateIcon