easy_ml 0.2.0.pre.rc71 → 0.2.0.pre.rc75

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5f0b198fdf362bfbeecaf470f68c3569fa7acee3497b215365c34edfe3ad85a9
-  data.tar.gz: 35157026161ddc0971d7facb2f4a2420580c950579a21d87e53e435f12aadf78
+  metadata.gz: 9c924f9d9ccee9dcad409f1dd077b55f29214aea419c4edbf3f7f7d16b8d71e6
+  data.tar.gz: c82401ebf3763354d77ff536d12d81bc9642ce9145bce961f9c274b535b16eea
 SHA512:
-  metadata.gz: 978b74ce4888414cd3a98a1d8b7fc0fd9282421f02ec21f3d60c0d7e2eb1970cbbcd1500420d7684f9e517d3126918b23766f076f45024a2a6d675079d642e3d
-  data.tar.gz: bf4b621fefeb4cd8d8e436a1cca0af306af6e841141d0386f4fe7d08ef3066a4ecdc1a0696073a3b14a79f5c3a4b9fa68d43bfac4c2189001f0c74ff27038f28
+  metadata.gz: 2df9bbd0fd82067fa4ec5976ba5f5292e2c052ff1eeaad0286b44cbfe4797cf02102fba788a01963b413a33a51297c5501f623310461fda18c2f541a61c2172c
+  data.tar.gz: 0f131bc4143b76d1b13641716854d1bf7ed0c06751cf31b69ebd2a8f1ec96abb1417d38d72039fd8266619c3183250ef1d0b39dc4b9381fa15843a910271387e

data/app/controllers/easy_ml/datasets_controller.rb

@@ -129,6 +129,39 @@ module EasyML
       redirect_to easy_ml_datasets_path, notice: "Dataset refresh has been initiated."
     end
 
+    def abort
+      dataset = Dataset.find(params[:id])
+      dataset.abort!
+
+      redirect_to easy_ml_datasets_path, notice: "Dataset processing has been aborted."
+    end
+
+    def download
+      dataset = Dataset.find(params[:id])
+      config = dataset.to_config
+
+      send_data JSON.pretty_generate(config),
+                filename: "#{dataset.name.parameterize}-config.json",
+                type: "application/json",
+                disposition: "attachment"
+    end
+
+    def upload
+      dataset = Dataset.find(params[:id]) if params[:id].present?
+
+      begin
+        config = JSON.parse(params[:config].read)
+        action = dataset.present? ? :update : :create
+        EasyML::Dataset.from_config(config, action: action, dataset: dataset)
+
+        flash[:notice] = "Dataset configuration was successfully uploaded."
+        redirect_to easy_ml_datasets_path
+      rescue JSON::ParserError, StandardError => e
+        flash[:error] = "Failed to upload configuration: #{e.message}"
+        redirect_to easy_ml_datasets_path
+      end
+    end
+
     private
 
     def preprocessing_params

data/app/controllers/easy_ml/datasources_controller.rb

@@ -80,6 +80,13 @@ module EasyML
       redirect_to easy_ml_datasources_path, error: "Datasource not found..."
     end
 
+    def abort
+      datasource = Datasource.find(params[:id])
+      datasource.abort!
+
+      redirect_to easy_ml_datasources_path, notice: "Datasource sync has been aborted."
+    end
+
     private
 
     def datasource_params

data/app/controllers/easy_ml/models_controller.rb

@@ -23,6 +23,7 @@ module EasyML
 
       render inertia: "pages/ModelsPage", props: {
         models: models.map { |model| model_to_json(model) },
+        datasets: EasyML::Dataset.all.map { |dataset| dataset.slice(:id, :name, :num_rows) },
       }
     end
 
@@ -118,6 +119,51 @@ module EasyML
       redirect_to easy_ml_models_path
     end
 
+    def abort
+      model = Model.find(params[:id])
+      model.abort!
+
+      flash[:notice] = "Model training aborted!"
+      redirect_to easy_ml_models_path
+    end
+
+    def download
+      model = Model.find(params[:id])
+      config = model.to_config(include_dataset: params[:include_dataset] == "true")
+
+      send_data JSON.pretty_generate(config),
+                filename: "#{model.name.parameterize}-config.json",
+                type: "application/json",
+                disposition: "attachment"
+    end
+
+    def upload
+      model = Model.find(params[:id]) if params[:id].present?
+
+      begin
+        config = JSON.parse(params[:config].read)
+        dataset = if params[:dataset_id].present?
+            EasyML::Dataset.find(params[:dataset_id])
+          else
+            model.dataset
+          end
+
+        action = model.present? ? :update : :create
+
+        EasyML::Model.from_config(config,
+                                  action: action,
+                                  model: model,
+                                  include_dataset: params[:include_dataset] == "true",
+                                  dataset: dataset)
+
+        flash[:notice] = "Model configuration was successfully uploaded."
+        redirect_to easy_ml_models_path
+      rescue JSON::ParserError, StandardError => e
+        flash[:error] = "Failed to upload configuration: #{e.message}"
+        redirect_to easy_ml_models_path
+      end
+    end
+
     private
 
     def includes_list

data/app/frontend/components/DatasetCard.tsx

@@ -0,0 +1,212 @@
+import React from 'react';
+import { Link } from '@inertiajs/react';
+import { Database, Trash2, ExternalLink, Loader2, AlertCircle, ChevronDown, ChevronUp, RefreshCw, XCircle, Download, Upload } from 'lucide-react';
+import { Dataset, DatasetWorkflowStatus, Column } from "@types/dataset";
+import { StackTrace } from './StackTrace';
+
+interface Props {
+  dataset: Dataset;
+  rootPath: string;
+  onDelete: (id: number) => void;
+  onRefresh: (id: number) => void;
+  onAbort: (id: number) => void;
+  isErrorExpanded: boolean;
+  onToggleError: (id: number) => void;
+}
+
+const STATUS_STYLES: Record<DatasetWorkflowStatus, { bg: string; text: string; icon: React.ReactNode }> = {
+  analyzing: {
+    bg: 'bg-blue-100',
+    text: 'text-blue-800',
+    icon: <Loader2 className="w-4 h-4 animate-spin" />
+  },
+  ready: {
+    bg: 'bg-green-100',
+    text: 'text-green-800',
+    icon: null
+  },
+  failed: {
+    bg: 'bg-red-100',
+    text: 'text-red-800',
+    icon: <AlertCircle className="w-4 h-4" />
+  },
+};
+
+export function DatasetCard({
+  dataset,
+  rootPath,
+  onDelete,
+  onRefresh,
+  onAbort,
+  isErrorExpanded,
+  onToggleError
+}: Props) {
+  // Create a hidden file input for handling uploads
+  const fileInputRef = React.useRef<HTMLInputElement>(null);
+
+  const handleDownload = () => {
+    window.location.href = `${rootPath}/datasets/${dataset.id}/download`;
+  };
+
+  const handleUpload = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const file = event.target.files?.[0];
+    if (!file) return;
+
+    const formData = new FormData();
+    formData.append('config', file);
+
+    fetch(`${rootPath}/datasets/${dataset.id}/upload`, {
+      method: 'POST',
+      body: formData,
+      credentials: 'same-origin',
+      headers: {
+        'X-CSRF-Token': document.querySelector<HTMLMetaElement>('meta[name="csrf-token"]')?.content || '',
+      },
+    }).then(response => {
+      if (response.ok) {
+        window.location.reload();
+      } else {
+        console.error('Upload failed');
+      }
+    });
+  };
+
+  return (
+    <div className="bg-white rounded-lg shadow-md p-6 hover:shadow-lg transition-shadow">
+      <div className="flex justify-between items-start mb-4">
+        <div className="flex items-start gap-3">
+          <Database className="w-5 h-5 text-blue-600 mt-1" />
+          <div>
+            <div className="flex items-center gap-2">
+              <h3 className="text-lg font-semibold text-gray-900">
+                {dataset.name}
+              </h3>
+              <div className={`inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-xs font-medium ${STATUS_STYLES[dataset.workflow_status].bg} ${STATUS_STYLES[dataset.workflow_status].text}`}>
+                {STATUS_STYLES[dataset.workflow_status].icon}
+                <span>{dataset.workflow_status.charAt(0).toUpperCase() + dataset.workflow_status.slice(1)}</span>
+              </div>
+            </div>
+            <p className="text-sm text-gray-500 mt-1">
+              {dataset.description}
+            </p>
+          </div>
+        </div>
+        <div className="flex gap-2">
+          <Link
+            href={`${rootPath}/datasets/${dataset.id}`}
+            className={`transition-colors ${
+              dataset.workflow_status === 'analyzing'
+                ? 'text-gray-300 cursor-not-allowed pointer-events-none'
+                : 'text-gray-400 hover:text-blue-600'
+            }`}
+            title={dataset.workflow_status === 'analyzing' ? 'Dataset is being analyzed' : 'View details'}
+          >
+            <ExternalLink className="w-5 h-5" />
+          </Link>
+          <button
+            onClick={() => onRefresh(dataset.id)}
+            disabled={dataset.workflow_status === 'analyzing'}
+            className={`transition-colors ${
+              dataset.workflow_status === 'analyzing'
+                ? 'text-gray-300 cursor-not-allowed'
+                : 'text-gray-400 hover:text-blue-600'
+            }`}
+            title={dataset.workflow_status === 'analyzing' ? 'Dataset is being analyzed' : 'Refresh dataset'}
+          >
+            <RefreshCw className="w-5 h-5" />
+          </button>
+          {dataset.workflow_status === 'analyzing' && (
+            <button
+              onClick={() => onAbort(dataset.id)}
+              className="text-gray-400 hover:text-red-600 transition-colors"
+              title="Abort analysis"
+            >
+              <XCircle className="w-5 h-5" />
+            </button>
+          )}
+          <button
+            onClick={handleDownload}
+            className="text-gray-400 hover:text-blue-600 transition-colors"
+            title="Download dataset configuration"
+          >
+            <Download className="w-5 h-5" />
+          </button>
+          <button
+            onClick={() => fileInputRef.current?.click()}
+            className="text-gray-400 hover:text-green-600 transition-colors"
+            title="Upload dataset configuration"
+          >
+            <Upload className="w-5 h-5" />
+          </button>
+          <input
+            type="file"
+            ref={fileInputRef}
+            onChange={handleUpload}
+            accept=".json"
+            className="hidden"
+          />
+          <button
+            className="text-gray-400 hover:text-red-600 transition-colors"
+            title="Delete dataset"
+            onClick={() => onDelete(dataset.id)}
+          >
+            <Trash2 className="w-5 h-5" />
+          </button>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-2 gap-4 mt-4">
+        <div>
+          <span className="text-sm text-gray-500">Columns</span>
+          <p className="text-sm font-medium text-gray-900">
+            {dataset.columns.length} columns
+          </p>
+        </div>
+        <div>
+          <span className="text-sm text-gray-500">Rows</span>
+          <p className="text-sm font-medium text-gray-900">
+            {dataset.num_rows.toLocaleString()}
+          </p>
+        </div>
+      </div>
+
+      <div className="mt-4 pt-4 border-t border-gray-100">
+        <div className="flex flex-wrap gap-2">
+          {dataset.columns.slice(0, 3).map((column: Column) => (
+            <span
+              key={column.name}
+              className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800"
+            >
+              {column.name}
+            </span>
+          ))}
+          {dataset.columns.length > 3 && (
+            <span className="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800">
+              +{dataset.columns.length - 3} more
+            </span>
+          )}
+        </div>
+      </div>
+
+      {dataset.workflow_status === 'failed' && dataset.stacktrace && (
+        <div className="mt-4 pt-4 border-t border-gray-100">
+          <button
+            onClick={() => onToggleError(dataset.id)}
+            className="flex items-center gap-2 text-sm text-red-600 hover:text-red-700"
+          >
+            <AlertCircle className="w-4 h-4" />
+            <span>View Error Details</span>
+            {isErrorExpanded ? (
+              <ChevronUp className="w-4 h-4" />
+            ) : (
+              <ChevronDown className="w-4 h-4" />
+            )}
+          </button>
+          {isErrorExpanded && (
+            <StackTrace stacktrace={dataset.stacktrace} />
+          )}
+        </div>
+      )}
+    </div>
+  );
+}

data/app/frontend/components/ModelCard.tsx

@@ -1,20 +1,33 @@
 import React, { useState, useEffect } from 'react';
-import { Activity, Calendar, Database, Settings, ExternalLink, Play, LineChart,
-        Trash2, Loader2, XCircle, CheckCircle2, AlertCircle, ChevronDown, ChevronUp } from 'lucide-react';
+import {
+  Activity, Calendar, Database, Settings, ExternalLink, Play, LineChart,
+  Trash2, Loader2, XCircle, CheckCircle2, AlertCircle, ChevronDown, ChevronUp,
+  Download, Upload
+} from 'lucide-react';
 import { Link, router } from "@inertiajs/react";
 import { cn } from '@/lib/utils';
 import type { Model, RetrainingJob, RetrainingRun } from '../types';
-
+import { StackTrace } from './StackTrace';
+import { DownloadModelModal, UploadModelModal } from './models';
+import { Dataset } from '../types';
 interface ModelCardProps {
   initialModel: Model;
   onViewDetails: (modelId: number) => void;
   handleDelete: (modelId: number) => void;
   rootPath: string;
+  datasets: Array<Dataset>;
 }
 
-export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath }: ModelCardProps) {
+export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath, datasets }: ModelCardProps) {
   const [model, setModel] = useState(initialModel);
   const [showError, setShowError] = useState(false);
+  const [showDownloadModal, setShowDownloadModal] = useState(false);
+  const [showUploadModal, setShowUploadModal] = useState(false);
+
+  // Update local state when initialModel changes
+  useEffect(() => {
+    setModel(initialModel);
+  }, [initialModel]);
 
   useEffect(() => {
     let pollInterval: number | undefined;
@@ -53,6 +66,25 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
     }
   };
 
+  const handleAbort = async () => {
+    try {
+      await router.post(`${rootPath}/models/${model.id}/abort`, {}, {
+        preserveScroll: true,
+        preserveState: true
+      });
+      const response = await fetch(`${rootPath}/models/${model.id}`, {
+        headers: {
+          'Accept': 'application/json'
+        }
+      });
+      const data = await response.json();
+      setModel(data.model);
+    } catch (error) {
+      console.error('Failed to abort training:', error);
+      setShowError(true);
+    }
+  };
+
   const dataset = model.dataset;
   const job = model.retraining_job;
   const lastRun = model.last_run;
@@ -77,6 +109,7 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
     if (model.is_training) return 'Training in progress...';
     if (!lastRun) return 'Never trained';
     if (lastRun.status === 'failed') return 'Last run failed';
+    if (lastRun.status === 'aborted') return 'Last run aborted';
     if (lastRun.status === 'success') {
       return lastRun.deployable ? 'Last run succeeded' : 'Last run completed (below threshold)';
     }
@@ -93,12 +126,29 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
     return 'text-gray-700';
   };
 
+  const renderTrainingStatus = () => {
+    if (model.is_training) {
+      return (
+        <div className="flex items-center space-x-2">
+          <button
+            onClick={handleAbort}
+            className="text-gray-400 hover:text-red-600"
+            title="Abort training"
+          >
+            <XCircle className="w-5 h-5" />
+          </button>
+        </div>
+      );
+    }
+    return null;
+  };
+
   return (
     <div className="bg-white rounded-lg shadow-md p-6 hover:shadow-lg transition-shadow">
       <div className="flex flex-col gap-2">
         <div className="flex items-center gap-2">
           <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium
-            ${model.deployment_status === 'inference' 
+            ${model.deployment_status === 'inference'
               ? 'bg-blue-100 text-blue-800'
               : 'bg-gray-100 text-gray-800'}`}
           >
@@ -118,13 +168,41 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
             <button
               onClick={handleTrain}
               disabled={model.is_training}
-              className={`text-gray-400 hover:text-green-600 transition-colors ${
-                model.is_training ? 'opacity-50 cursor-not-allowed' : ''
-              }`}
+              className={`text-gray-400 hover:text-green-600 transition-colors ${model.is_training ? 'opacity-50 cursor-not-allowed' : ''
+                }`}
               title="Train model"
             >
               <Play className="w-5 h-5" />
             </button>
+            {renderTrainingStatus()}
+            <button
+              onClick={() => setShowDownloadModal(true)}
+              className="text-gray-400 hover:text-blue-600"
+              title="Download configuration"
+            >
+              <Download className="w-5 h-5" />
+            </button>
+            <button
+              onClick={() => setShowUploadModal(true)}
+              className="text-gray-400 hover:text-green-600"
+              title="Upload configuration"
+            >
+              <Upload className="w-5 h-5" />
+            </button>
+            <Link
+              href={`${rootPath}/models/${model.id}/edit`}
+              className="text-gray-400 hover:text-gray-600"
+              title="Edit model"
+            >
+              <Settings className="w-5 h-5" />
+            </Link>
+            <button
+              onClick={() => handleDelete(model.id)}
+              className="text-gray-400 hover:text-gray-600"
+              title="Delete model"
+            >
+              <Trash2 className="w-5 h-5" />
+            </button>
             {
               model.metrics_url && (
                 <a
@@ -145,20 +223,6 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
             >
               <ExternalLink className="w-5 h-5" />
             </Link>
-            <Link
-              href={`${rootPath}/models/${model.id}/edit`}
-              className="text-gray-400 hover:text-gray-600"
-              title="Edit model"
-            >
-              <Settings className="w-5 h-5" />
-            </Link>
-            <button
-              onClick={() => handleDelete(model.id)}
-              className="text-gray-400 hover:text-gray-600"
-              title="Delete model"
-            >
-              <Trash2 className="w-5 h-5" />
-            </button>
           </div>
         </div>
 
@@ -176,7 +240,7 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
         <div className="flex items-center gap-2">
           <Database className="w-4 h-4 text-gray-400" />
           {dataset ? (
-            <Link 
+            <Link
               href={`${rootPath}/datasets/${dataset.id}`}
               className="text-sm text-blue-600 hover:text-blue-800"
             >
@@ -214,11 +278,10 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
             {Object.entries(lastRun.metrics as Record<string, number>).map(([key, value]) => (
               <div
                 key={key}
-                className={`px-2 py-1 rounded-md text-xs font-medium ${
-                  lastRun.deployable
+                className={`px-2 py-1 rounded-md text-xs font-medium ${lastRun.deployable
                     ? 'bg-green-100 text-green-800'
                     : 'bg-red-100 text-red-800'
-                }`}
+                  }`}
               >
                 {key}: {value.toFixed(4)}
               </div>
@@ -243,13 +306,35 @@ export function ModelCard({ initialModel, onViewDetails, handleDelete, rootPath
           </button>
           {showError && (
             <div className="mt-2 p-3 bg-red-50 rounded-md">
-              <pre className="text-xs text-red-700 whitespace-pre-wrap font-mono">
-                {lastRun.stacktrace}
-              </pre>
+              <StackTrace stacktrace={lastRun.stacktrace} />
             </div>
           )}
         </div>
       )}
+      {showDownloadModal && (
+        <DownloadModelModal
+          isOpen={showDownloadModal}
+          onClose={() => setShowDownloadModal(false)}
+          modelId={model.id}
+        />
+      )}
+
+      {showUploadModal && (
+        <UploadModelModal
+          isOpen={showUploadModal}
+          onClose={() => setShowUploadModal(false)}
+          modelId={model.id}
+          dataset_id={model.dataset_id}
+          datasets={datasets}
+        />
+      )}
+      <div className="flex items-center space-x-4">
+        <button
+          onClick={() => onViewDetails(model.id)}
+          className="text-gray-400 hover:text-blue-600"
+        >
+        </button>
+      </div>
     </div>
   );
 }

data/app/frontend/components/StackTrace.tsx

@@ -0,0 +1,13 @@
+interface StackTraceProps {
+  stacktrace: string;
+}
+
+export function StackTrace({ stacktrace }: StackTraceProps) {
+  return (
+    <div className="mt-2 p-3 bg-red-50 rounded-md">
+      <pre className="text-xs text-red-700 whitespace-pre-wrap break-words [word-break:break-word] font-mono">
+        {stacktrace}
+      </pre>
+    </div>
+  );
+}

data/app/frontend/components/dataset/FeatureConfigPopover.tsx

@@ -37,16 +37,19 @@ module Features
   class DidConvert
     include EasyML::Features
 
-    def did_convert(df)
+    def computes_columns
+      ["did_convert"]
+    end
+
+    def transform(df, feature)
       df.with_column(
-        (Polars.col("rev") > 0)
-          .alias("did_convert")
+        (Polars.col("rev") > 0).alias("did_convert")
       )
     end
-    
-    feature :did_convert,
-      name: "Did Convert",
-      description: "Boolean true/false..."
+
+    feature name: "did_convert",
+            description: "Boolean true/false, did the loan application fund?"
+
   end
 end`}
           </code>

data/app/frontend/components/datasets/UploadDatasetButton.tsx

@@ -0,0 +1,51 @@
+import React, { useRef } from 'react';
+import { Upload } from 'lucide-react';
+import { router, usePage } from '@inertiajs/react';
+
+export function UploadDatasetButton() {
+  const fileInputRef = useRef<HTMLInputElement>(null);
+  const { rootPath } = usePage().props;
+
+  const handleUpload = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const file = event.target.files?.[0];
+    if (!file) return;
+
+    const formData = new FormData();
+    formData.append('config', file);
+
+    fetch(`${rootPath}/datasets/upload`, {
+      method: 'POST',
+      body: formData,
+      credentials: 'same-origin',
+      headers: {
+        'X-CSRF-Token': document.querySelector<HTMLMetaElement>('meta[name="csrf-token"]')?.content || '',
+      },
+    }).then(response => {
+      if (response.ok) {
+        window.location.reload();
+      } else {
+        console.error('Upload failed');
+      }
+    });
+  };
+
+  return (
+    <>
+      <button
+        onClick={() => fileInputRef.current?.click()}
+        className="inline-flex items-center gap-2 px-4 py-2 bg-white border border-gray-300 text-sm font-medium rounded-md text-gray-700 hover:bg-gray-50"
+        title="Import dataset"
+      >
+        <Upload className="w-4 h-4" />
+        Import
+      </button>
+      <input
+        type="file"
+        ref={fileInputRef}
+        onChange={handleUpload}
+        accept=".json"
+        className="hidden"
+      />
+    </>
+  );
+}