@ketrics/ketrics-cli 0.2.2 → 0.3.0

package/templates/HelloWorld/frontend/src/App.css

@@ -11,23 +11,24 @@ body {
   min-height: 100vh;
   display: flex;
   justify-content: center;
-  align-items: center;
+  align-items: flex-start;
   padding: 20px;
 }
 
 .app {
   background: white;
   border-radius: 12px;
-  padding: 40px;
-  max-width: 500px;
+  padding: 32px;
+  max-width: 700px;
   width: 100%;
   box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
+  margin-top: 20px;
 }
 
 h1 {
   color: #333;
-  margin-bottom: 8px;
-  font-size: 28px;
+  margin-bottom: 4px;
+  font-size: 26px;
 }
 
 .subtitle {
@@ -36,86 +37,110 @@ h1 {
   font-size: 14px;
 }
 
-.form {
+.sections {
   display: flex;
-  gap: 12px;
-  margin-bottom: 16px;
+  flex-direction: column;
+  gap: 20px;
 }
 
-.input {
-  flex: 1;
-  padding: 12px 16px;
-  border: 2px solid #e0e0e0;
-  border-radius: 8px;
-  font-size: 16px;
-  transition: border-color 0.2s;
+.section h2 {
+  font-size: 14px;
+  color: #555;
+  margin-bottom: 8px;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
 }
 
-.input:focus {
-  outline: none;
-  border-color: #667eea;
+.button-group {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
 }
 
 .button {
-  padding: 12px 24px;
+  padding: 8px 16px;
   background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
   color: white;
   border: none;
-  border-radius: 8px;
-  font-size: 16px;
-  font-weight: 600;
+  border-radius: 6px;
+  font-size: 13px;
+  font-weight: 500;
   cursor: pointer;
-  transition: transform 0.2s, box-shadow 0.2s;
+  transition: transform 0.15s, box-shadow 0.15s, opacity 0.15s;
 }
 
-.button:hover {
-  transform: translateY(-2px);
+.button:hover:not(:disabled) {
+  transform: translateY(-1px);
   box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
 }
 
-.button:active {
+.button:active:not(:disabled) {
   transform: translateY(0);
 }
 
+.button:disabled {
+  opacity: 0.6;
+  cursor: not-allowed;
+}
+
+.loading {
+  color: #667eea;
+  font-weight: 500;
+  padding: 12px;
+  margin-top: 16px;
+}
+
 .error {
   color: #e53e3e;
   background: #fed7d7;
   padding: 12px;
   border-radius: 8px;
-  margin-bottom: 16px;
+  margin-top: 16px;
+  font-size: 14px;
 }
 
 .result {
-  color: #38a169;
-  background: #c6f6d5;
-  padding: 12px;
+  background: #f0fdf4;
+  border: 1px solid #bbf7d0;
   border-radius: 8px;
-  margin-bottom: 16px;
+  margin-top: 16px;
+  padding: 12px;
+  overflow-x: auto;
+}
+
+.result pre {
+  font-size: 12px;
+  color: #166534;
+  white-space: pre-wrap;
+  word-break: break-word;
+  margin: 0;
 }
 
 .info {
-  margin-top: 32px;
-  padding-top: 24px;
+  margin-top: 24px;
+  padding-top: 20px;
   border-top: 1px solid #e0e0e0;
 }
 
 .info h2 {
-  font-size: 18px;
+  font-size: 16px;
   color: #333;
-  margin-bottom: 12px;
+  margin-bottom: 8px;
 }
 
 .info p {
   color: #666;
-  margin-bottom: 12px;
+  margin-bottom: 8px;
   line-height: 1.5;
+  font-size: 14px;
 }
 
 .info ul {
   color: #666;
   padding-left: 20px;
+  font-size: 13px;
 }
 
 .info li {
-  margin-bottom: 6px;
+  margin-bottom: 4px;
 }

package/templates/HelloWorld/frontend/src/App.tsx

@@ -1,141 +1,161 @@
 import { useState } from "react";
-import { z } from "zod";
 import { apiClient } from "./services";
 
-const inputSchema = z.string().min(1, "Input is required").max(100, "Max 100 characters");
-
 function App() {
-  const [input, setInput] = useState("");
   const [result, setResult] = useState<string | null>(null);
   const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
 
-  const handleSubmit = () => {
-    const validation = inputSchema.safeParse(input);
-    if (!validation.success) {
-      setError(validation.error.errors[0].message);
-      setResult(null);
-      return;
-    }
+  const runFunction = async (fnName: string, payload?: unknown) => {
+    setLoading(true);
     setError(null);
-    setResult(`You submitted: ${validation.data}`);
-  };
-
-  const handleRunEcho = async () => {
-    try {
-      const data = await apiClient.run("echo");
-      console.log("API Data:", data);
-    } catch (err) {
-      console.error("API Error:", err);
-    }
-  };
-
-  const handleRunSaveFile = async () => {
-    try {
-      const data = await apiClient.run("saveFile");
-      console.log("API Data:", data);
-    } catch (err) {
-      console.error("API Error:", err);
-    }
-  };
-
-  const handleRunReadFile = async () => {
-    try {
-      const data = await apiClient.run("readFile");
-      console.log("API Data:", data);
-    } catch (err) {
-      console.error("API Error:", err);
-    }
-  };
-
-  const handleRunGenerateDownloadUrl = async () => {
-    try {
-      const data = await apiClient.run("generateDownloadUrl");
-      // Trigger download of the file in the url data.result.url
-      const downloadUrl = data.result.url;
-      const link = document.createElement("a");
-      link.href = downloadUrl;
-      link.target = "_blank";
-      link.download = "data.json";
-      document.body.appendChild(link);
-      link.click();
-      document.body.removeChild(link);
-      console.log("downloadUrl:", downloadUrl);
-    } catch (err) {
-      console.error("API Error:", err);
-    }
-  };
-
-  const handleRunTestWriteFileWithoutVolumeGrant = async () => {
+    setResult(null);
     try {
-      const data = await apiClient.run("testWriteFileWithoutVolumeGrant");
-      console.log("API Data:", data);
+      const data = await apiClient.run(fnName, payload);
+      setResult(JSON.stringify(data, null, 2));
     } catch (err) {
-      console.error("API Error:", err);
+      setError(err instanceof Error ? err.message : "An error occurred");
+    } finally {
+      setLoading(false);
     }
   };
 
-  const handleGetSecret = async () => {
-    try {
-      const data = await apiClient.run("getSecret");
-      console.log("Secret Data:", data);
-    } catch (err) {
-      console.error("Secret Error:", err);
-    }
-  };
-
-  const handleGetSecretWithoutGrant = async () => {
+  const handleDownload = async (fnName: string, payload?: unknown) => {
+    setLoading(true);
+    setError(null);
+    setResult(null);
     try {
-      const data = await apiClient.run("getSecretWithoutGrant");
-      console.log("Secret Data:", data);
+      const data = await apiClient.run(fnName, payload);
+      const downloadUrl = data?.result?.downloadUrl;
+      if (downloadUrl) {
+        const link = document.createElement("a");
+        link.href = downloadUrl;
+        link.target = "_blank";
+        document.body.appendChild(link);
+        link.click();
+        document.body.removeChild(link);
+        setResult(`Download started. URL: ${downloadUrl}`);
+      } else {
+        setResult(JSON.stringify(data, null, 2));
+      }
     } catch (err) {
-      console.error("Secret Error:", err);
+      setError(err instanceof Error ? err.message : "An error occurred");
+    } finally {
+      setLoading(false);
     }
   };
 
   return (
     <div className="app">
-      <h1>Ketrics Test Application</h1>
-      <p className="subtitle">Frontend Demo with Zod Validation</p>
-
-      <div className="form">
-        <input type="text" value={input} onChange={(e) => setInput(e.target.value)} placeholder="Enter something..." className="input" />
-        <button onClick={handleSubmit} className="button">
-          Submit
-        </button>
-
-        <button onClick={handleRunEcho} className="button">
-          Test Echo API
-        </button>
-        <button onClick={handleRunSaveFile} className="button">
-          Test Save File API
-        </button>
-        <button onClick={handleRunReadFile} className="button">
-          Test Read File API
-        </button>
-        <button onClick={handleRunGenerateDownloadUrl} className="button">
-          Test Generate Download URL API
-        </button>
-        <button onClick={handleRunTestWriteFileWithoutVolumeGrant} className="button">
-          Test Write File Without Volume Grant API
-        </button>
-        <button onClick={handleGetSecret} className="button">
-          Get Secret with Grant
-        </button>
-        <button onClick={handleGetSecretWithoutGrant} className="button">
-          Get Secret without Grant
-        </button>
+      <h1>Ketrics Application</h1>
+      <p className="subtitle">SDK Feature Examples</p>
+
+      <div className="sections">
+        <div className="section">
+          <h2>General</h2>
+          <div className="button-group">
+            <button onClick={() => runFunction("echo", { message: "Hello!" })} className="button" disabled={loading}>
+              Echo
+            </button>
+            <button onClick={() => runFunction("info")} className="button" disabled={loading}>
+              Info
+            </button>
+            <button onClick={() => runFunction("fetchExternalApi")} className="button" disabled={loading}>
+              HTTP Request
+            </button>
+          </div>
+        </div>
+
+        <div className="section">
+          <h2>Volumes</h2>
+          <div className="button-group">
+            <button onClick={() => runFunction("saveFile")} className="button" disabled={loading}>
+              Save File
+            </button>
+            <button onClick={() => runFunction("readFile")} className="button" disabled={loading}>
+              Read File
+            </button>
+            <button onClick={() => runFunction("listFiles", { prefix: "output/" })} className="button" disabled={loading}>
+              List Files
+            </button>
+            <button onClick={() => handleDownload("generateDownloadUrl")} className="button" disabled={loading}>
+              Download File
+            </button>
+            <button onClick={() => runFunction("copyFile")} className="button" disabled={loading}>
+              Copy File
+            </button>
+          </div>
+        </div>
+
+        <div className="section">
+          <h2>Database</h2>
+          <div className="button-group">
+            <button onClick={() => runFunction("queryUsers", { limit: 5 })} className="button" disabled={loading}>
+              Query Users
+            </button>
+            <button onClick={() => runFunction("insertRecord", { name: "Test User", email: "test@example.com" })} className="button" disabled={loading}>
+              Insert Record
+            </button>
+            <button onClick={() => runFunction("transferFunds", { fromAccountId: 1, toAccountId: 2, amount: 100 })} className="button" disabled={loading}>
+              Transfer Funds
+            </button>
+          </div>
+        </div>
+
+        <div className="section">
+          <h2>Documents</h2>
+          <div className="button-group">
+            <button onClick={() => handleDownload("createSimplePdf")} className="button" disabled={loading}>
+              Create PDF
+            </button>
+            <button onClick={() => handleDownload("createInvoicePdf")} className="button" disabled={loading}>
+              Create Invoice PDF
+            </button>
+            <button onClick={() => handleDownload("createSpreadsheet")} className="button" disabled={loading}>
+              Create Spreadsheet
+            </button>
+            <button onClick={() => handleDownload("exportDataToExcel")} className="button" disabled={loading}>
+              Export to Excel
+            </button>
+          </div>
+        </div>
+
+        <div className="section">
+          <h2>Messaging & Jobs</h2>
+          <div className="button-group">
+            <button onClick={() => runFunction("sendNotification", { subject: "Test", body: "Hello from the app!" })} className="button" disabled={loading}>
+              Send Notification
+            </button>
+            <button onClick={() => runFunction("scheduleBackgroundJob")} className="button" disabled={loading}>
+              Schedule Job
+            </button>
+            <button onClick={() => runFunction("getSecret")} className="button" disabled={loading}>
+              Get Secret
+            </button>
+          </div>
+        </div>
       </div>
 
+      {loading && <p className="loading">Running...</p>}
       {error && <p className="error">{error}</p>}
-      {result && <p className="result">{result}</p>}
+      {result && (
+        <div className="result">
+          <pre>{result}</pre>
+        </div>
+      )}
 
       <div className="info">
         <h2>About</h2>
-        <p>This is a test application for the Ketrics platform. It demonstrates:</p>
+        <p>This application demonstrates the Ketrics SDK features:</p>
         <ul>
-          <li>React + TypeScript + Vite setup</li>
-          <li>Zod schema validation</li>
-          <li>Deployment via Ketrics CLI</li>
+          <li>Volume storage (save, read, list, download, copy files)</li>
+          <li>Database connections (query, insert, transactions)</li>
+          <li>PDF document generation (simple and invoice-style)</li>
+          <li>Excel workbook creation (single and multi-sheet)</li>
+          <li>User messaging and notifications</li>
+          <li>Background job scheduling</li>
+          <li>Secret management</li>
+          <li>External HTTP requests</li>
         </ul>
       </div>
     </div>

package/templates/HelloWorld/frontend/src/services/index.ts

@@ -1,14 +1,12 @@
 import { createAuthManager } from "@ketrics/sdk-frontend";
-import axios from "axios";
 
 const auth = createAuthManager();
 
 // Initialize auto-refresh
 auth.initAutoRefresh({
   refreshBuffer: 60,
-  onTokenUpdated: (token) => {
-    // Update your HTTP client headers
-    axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
+  onTokenUpdated: () => {
+    // Token is refreshed automatically and retrieved via getAccessToken()
   },
 });
 
@@ -19,7 +17,7 @@ class APIClient {
     this.auth = authManager;
   }
 
-  private async makeRequest(fnName: string) {
+  private async makeRequest(fnName: string, payload?: unknown) {
     const runtimeApiUrl = this.auth.getRuntimeApiUrl();
     const tenantId = this.auth.getTenantId();
     const applicationId = this.auth.getApplicationId();
@@ -32,21 +30,23 @@ class APIClient {
     const response = await fetch(`${runtimeApiUrl}/tenants/${tenantId}/applications/${applicationId}/functions/${fnName}`, {
       method: "POST",
       headers: {
-        Authorization: `Bearer ${accessToken}`,
+        "Authorization": `Bearer ${accessToken}`,
+        "Content-Type": "application/json",
       },
+      body: JSON.stringify({ payload: payload ?? null }),
     });
 
     if (!response.ok) {
-      throw new Error(`API request failed with status ${response.status}`);
+      const errorBody = await response.json().catch(() => null);
+      const message = errorBody?.error?.message || `API request failed with status ${response.status}`;
+      throw new Error(message);
     }
 
     return response.json();
   }
 
-  async run(fnName: string) {
-    const response = await this.makeRequest(fnName);
-
-    return response;
+  async run(fnName: string, payload?: unknown) {
+    return this.makeRequest(fnName, payload);
   }
 }
 

package/templates/HelloWorld/tests/test.createInvoicePdf.json

@@ -0,0 +1,18 @@
+{
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/createInvoicePdf",
+  "method": "POST",
+  "headers": {
+    "Authorization": "Bearer {{token}}",
+    "Content-Type": "application/json"
+  },
+  "body": {
+    "payload": {
+      "invoiceNumber": "INV-100",
+      "customerName": "Acme Corp",
+      "items": [
+        { "description": "Consulting", "quantity": 10, "price": 200 },
+        { "description": "Development", "quantity": 40, "price": 150 }
+      ]
+    }
+  }
+}

package/templates/HelloWorld/tests/{test.getSecretWithoutGrant.json → test.createSimplePdf.json}

@@ -1,9 +1,11 @@
 {
-  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/getSecretWithoutGrant",
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/createSimplePdf",
   "method": "POST",
   "headers": {
     "Authorization": "Bearer {{token}}",
     "Content-Type": "application/json"
   },
-  "body": {}
+  "body": {
+    "payload": null
+  }
 }

package/templates/HelloWorld/tests/test.createSpreadsheet.json

@@ -0,0 +1,11 @@
+{
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/createSpreadsheet",
+  "method": "POST",
+  "headers": {
+    "Authorization": "Bearer {{token}}",
+    "Content-Type": "application/json"
+  },
+  "body": {
+    "payload": null
+  }
+}

package/templates/HelloWorld/tests/test.echo.json

@@ -6,8 +6,8 @@
     "Content-Type": "application/json"
   },
   "body": {
-    "data": {
-      "hello": "world"
+    "payload": {
+      "message": "Hello, World!"
     }
   }
 }

package/templates/HelloWorld/tests/test.fetchExternalApi.json

@@ -0,0 +1,13 @@
+{
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/fetchExternalApi",
+  "method": "POST",
+  "headers": {
+    "Authorization": "Bearer {{token}}",
+    "Content-Type": "application/json"
+  },
+  "body": {
+    "payload": {
+      "url": "https://jsonplaceholder.typicode.com/posts/1"
+    }
+  }
+}

package/templates/HelloWorld/tests/test.getSecret.json

@@ -5,5 +5,9 @@
     "Authorization": "Bearer {{token}}",
     "Content-Type": "application/json"
   },
-  "body": {}
+  "body": {
+    "payload": {
+      "code": "apikey"
+    }
+  }
 }

package/templates/HelloWorld/tests/test.info.json

@@ -5,5 +5,7 @@
     "Authorization": "Bearer {{token}}",
     "Content-Type": "application/json"
   },
-  "body": {}
+  "body": {
+    "payload": null
+  }
 }

package/templates/HelloWorld/tests/test.listFiles.json

@@ -0,0 +1,13 @@
+{
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/listFiles",
+  "method": "POST",
+  "headers": {
+    "Authorization": "Bearer {{token}}",
+    "Content-Type": "application/json"
+  },
+  "body": {
+    "payload": {
+      "prefix": "output/"
+    }
+  }
+}

package/templates/HelloWorld/tests/{test.echo2.json → test.queryUsers.json}

@@ -1,13 +1,13 @@
 {
-  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/echo2",
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/queryUsers",
   "method": "POST",
   "headers": {
     "Authorization": "Bearer {{token}}",
     "Content-Type": "application/json"
   },
   "body": {
-    "data": {
-      "hello": "world"
+    "payload": {
+      "limit": 5
     }
   }
 }

package/templates/HelloWorld/tests/{test.greet.json → test.readFile.json}

@@ -1,11 +1,11 @@
 {
-  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/greet",
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/readFile",
   "method": "POST",
   "headers": {
     "Authorization": "Bearer {{token}}",
     "Content-Type": "application/json"
   },
   "body": {
-    "name": "Localhost"
+    "payload": null
   }
 }

package/templates/HelloWorld/tests/{test.testWriteFileWithoutVolumeGrant.json → test.saveFile.json}

@@ -1,9 +1,11 @@
 {
-  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/testWriteFileWithoutVolumeGrant",
+  "endpoint": "/tenants/{{tenantId}}/applications/{{applicationId}}/functions/saveFile",
   "method": "POST",
   "headers": {
     "Authorization": "Bearer {{token}}",
     "Content-Type": "application/json"
   },
-  "body": {}
+  "body": {
+    "payload": null
+  }
 }