Hugging Face's logo

Spaces:
aegisceo
/
apiingest-lite
Running

App Files Community
aegisceo commited on
Commit
8a421f7
·
verified ·
1 Parent(s): 23a636f

Add 3 files

Browse files
Files changed (3) hide show
  1. README.md +7 -5
  2. index.html +566 -19
  3. prompts.txt +1 -0
README.md CHANGED
@@ -1,10 +1,12 @@
1
  ---
2
- title: Apiingest Lite
3
- emoji: 👁
4
- colorFrom: indigo
5
- colorTo: gray
6
  sdk: static
7
  pinned: false
 
 
8
  ---
9
 
10
- Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
 
1
  ---
2
+ title: apiingest-lite
3
+ emoji: 🐳
4
+ colorFrom: yellow
5
+ colorTo: red
6
  sdk: static
7
  pinned: false
8
+ tags:
9
+ - deepsite
10
  ---
11
 
12
+ Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
index.html CHANGED
@@ -1,19 +1,566 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width" />
6
- <title>My static Space</title>
7
- <link rel="stylesheet" href="style.css" />
8
- </head>
9
- <body>
10
- <div class="card">
11
- <h1>Welcome to your static Space!</h1>
12
- <p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
13
- <p>
14
- Also don't forget to check the
15
- <a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
16
- </p>
17
- </div>
18
- </body>
19
- </html>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>API Ingestion Tool for LLMs</title>
7
+ <script src="https://cdn.tailwindcss.com"></script>
8
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
+ <style>
10
+ .animate-pulse-slow {
11
+ animation: pulse 2.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
12
+ }
13
+ @keyframes pulse {
14
+ 0%, 100% { opacity: 1; }
15
+ 50% { opacity: 0.5; }
16
+ }
17
+ .scrollbar-hide::-webkit-scrollbar {
18
+ display: none;
19
+ }
20
+ .json-viewer {
21
+ font-family: 'Courier New', monospace;
22
+ font-size: 0.9rem;
23
+ background-color: #1E293B;
24
+ border-radius: 0.5rem;
25
+ }
26
+ </style>
27
+ </head>
28
+ <body class="bg-gray-100 min-h-screen">
29
+ <div class="container mx-auto px-4 py-8 max-w-5xl">
30
+ <!-- Header -->
31
+ <header class="mb-8 text-center">
32
+ <h1 class="text-3xl font-bold text-gray-800">
33
+ <span class="text-blue-600">API</span> Ingestion Tool <span class="text-gray-500">for LLMs</span>
34
+ </h1>
35
+ <p class="text-gray-600 mt-2">Automate API documentation ingestion for your large language models</p>
36
+ </header>
37
+
38
+ <!-- Main Content -->
39
+ <div class="grid grid-cols-1 md:grid-cols-5 gap-6">
40
+ <!-- Left Panel - API Configuration -->
41
+ <div class="md:col-span-3 space-y-6">
42
+ <!-- API URL Input -->
43
+ <div class="bg-white rounded-lg shadow p-6">
44
+ <h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
45
+ <i class="fas fa-link mr-2 text-blue-500"></i>
46
+ API Configuration
47
+ </h2>
48
+ <div class="space-y-4">
49
+ <div>
50
+ <label class="block text-sm font-medium text-gray-700 mb-1">API Endpoint URL</label>
51
+ <div class="flex">
52
+ <input
53
+ type="text"
54
+ placeholder="https://api.example.com/v1"
55
+ class="flex-grow px-4 py-2 border border-gray-300 rounded-l-md focus:ring-blue-500 focus:border-blue-500"
56
+ id="apiUrl">
57
+ <button
58
+ class="px-4 py-2 bg-blue-600 text-white rounded-r-md hover:bg-blue-700 transition"
59
+ id="detectBtn">
60
+ <i class="fas fa-search mr-1"></i> Detect
61
+ </button>
62
+ </div>
63
+ </div>
64
+
65
+ <!-- Authentication Section -->
66
+ <div class="pt-4 border-t border-gray-200">
67
+ <h3 class="text-lg font-medium text-gray-800 mb-3 flex items-center">
68
+ <i class="fas fa-key mr-2 text-yellow-500"></i>
69
+ Authentication
70
+ </h3>
71
+ <div class="space-y-4">
72
+ <button id="detectAuthBtn" class="w-full py-2 px-4 bg-yellow-100 text-yellow-800 rounded-md hover:bg-yellow-200 transition flex items-center justify-center">
73
+ <i class="fas fa-search mr-2"></i> Detect Authentication Method
74
+ </button>
75
+
76
+ <div id="authOptions" class="hidden space-y-3">
77
+ <div class="flex items-center">
78
+ <input type="radio" name="authType" id="noAuth" value="none" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300">
79
+ <label for="noAuth" class="ml-2 block text-sm text-gray-700">No Authentication</label>
80
+ </div>
81
+ <div class="flex items-center">
82
+ <input type="radio" name="authType" id="apiKey" value="apiKey" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300">
83
+ <label for="apiKey" class="ml-2 block text-sm text-gray-700">API Key</label>
84
+ </div>
85
+ <div class="flex items-center">
86
+ <input type="radio" name="authType" id="oauth" value="oauth" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300">
87
+ <label for="oauth" class="ml-2 block text-sm text-gray-700">OAuth</label>
88
+ </div>
89
+ <div class="flex items-center">
90
+ <input type="radio" name="authType" id="basic" value="basic" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300">
91
+ <label for="basic" class="ml-2 block text-sm text-gray-700">Basic Auth</label>
92
+ </div>
93
+ </div>
94
+
95
+ <div id="authDetails" class="hidden space-y-4">
96
+ <!-- API Key Auth -->
97
+ <div id="apiKeyAuth" class="hidden space-y-2">
98
+ <div>
99
+ <label class="block text-sm font-medium text-gray-700 mb-1">Key Name</label>
100
+ <input type="text" placeholder="X-API-KEY" class="w-full px-4 py-2 border border-gray-300 rounded-md">
101
+ </div>
102
+ <div>
103
+ <label class="block text-sm font-medium text-gray-700 mb-1">API Key</label>
104
+ <input type="password" placeholder="Your API Key" class="w-full px-4 py-2 border border-gray-300 rounded-md">
105
+ </div>
106
+ <div>
107
+ <label class="block text-sm font-medium text-gray-700 mb-1">Location</label>
108
+ <select class="w-full px-4 py-2 border border-gray-300 rounded-md">
109
+ <option>Header</option>
110
+ <option>Query Parameter</option>
111
+ </select>
112
+ </div>
113
+ </div>
114
+
115
+ <!-- OAuth Auth -->
116
+ <div id="oauthAuth" class="hidden space-y-2">
117
+ <div>
118
+ <label class="block text-sm font-medium text-gray-700 mb-1">Client ID</label>
119
+ <input type="text" placeholder="Your Client ID" class="w-full px-4 py-2 border border-gray-300 rounded-md">
120
+ </div>
121
+ <div>
122
+ <label class="block text-sm font-medium text-gray-700 mb-1">Client Secret</label>
123
+ <input type="password" placeholder="Your Client Secret" class="w-full px-4 py-2 border border-gray-300 rounded-md">
124
+ </div>
125
+ <div>
126
+ <label class="block text-sm font-medium text-gray-700 mb-1">Token URL</label>
127
+ <input type="text" placeholder="https://api.example.com/oauth/token" class="w-full px-4 py-2 border border-gray-300 rounded-md">
128
+ </div>
129
+ </div>
130
+
131
+ <!-- Basic Auth -->
132
+ <div id="basicAuth" class="hidden space-y-2">
133
+ <div>
134
+ <label class="block text-sm font-medium text-gray-700 mb-1">Username</label>
135
+ <input type="text" placeholder="Your username" class="w-full px-4 py-2 border border-gray-300 rounded-md">
136
+ </div>
137
+ <div>
138
+ <label class="block text-sm font-medium text-gray-700 mb-1">Password</label>
139
+ <input type="password" placeholder="Your password" class="w-full px-4 py-2 border border-gray-300 rounded-md">
140
+ </div>
141
+ </div>
142
+ </div>
143
+ </div>
144
+ </div>
145
+
146
+ <!-- API Options -->
147
+ <div class="pt-4 border-t border-gray-200">
148
+ <h3 class="text-lg font-medium text-gray-800 mb-3 flex items-center">
149
+ <i class="fas fa-cog mr-2 text-purple-500"></i>
150
+ API Options
151
+ </h3>
152
+ <div class="space-y-4">
153
+ <div>
154
+ <label class="block text-sm font-medium text-gray-700 mb-1">Maximum Depth</label>
155
+ <select class="w-full px-4 py-2 border border-gray-300 rounded-md">
156
+ <option value="1">Shallow (1 level)</option>
157
+ <option value="2" selected>Standard (2 levels)</option>
158
+ <option value="3">Deep (3 levels)</option>
159
+ <option value="0">Complete (all levels)</option>
160
+ </select>
161
+ </div>
162
+
163
+ <div>
164
+ <label class="block text-sm font-medium text-gray-700 mb-1">Ingestion Approach</label>
165
+ <select class="w-full px-4 py-2 border border-gray-300 rounded-md">
166
+ <option value="documentation">Documentation Only</option>
167
+ <option value="documentation+examples" selected>Documentation + Examples</option>
168
+ <option value="documentation+examples+code">Plus Source Code Analysis</option>
169
+ </select>
170
+ </div>
171
+
172
+ <div class="flex items-center">
173
+ <input type="checkbox" id="paginationCheck" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300">
174
+ <label for="paginationCheck" class="ml-2 block text-sm text-gray-700">Include Pagination Logic</label>
175
+ </div>
176
+ </div>
177
+ </div>
178
+ </div>
179
+ </div>
180
+
181
+ <!-- Detection Buttons -->
182
+ <div class="bg-white rounded-lg shadow p-6">
183
+ <h2 class="text-xl font-semibold text-gray-800 mb-4 flex items-center">
184
+ <i class="fas fa-magic mr-2 text-green-500"></i>
185
+ Auto-Detection
186
+ </h2>
187
+ <div class="grid grid-cols-1 md:grid-cols-2 gap-3">
188
+ <button id="detectMethodsBtn" class="flex items-center justify-center px-4 py-3 bg-blue-50 text-blue-700 rounded-md hover:bg-blue-100 transition">
189
+ <i class="fas fa-random mr-2"></i> Detect Call Methods
190
+ </button>
191
+ <button id="detectProtocolBtn" class="flex items-center justify-center px-4 py-3 bg-purple-50 text-purple-700 rounded-md hover:bg-purple-100 transition">
192
+ <i class="fas fa-plug mr-2"></i> Detect Protocol
193
+ </button>
194
+ <button id="detectStructureBtn" class="flex items-center justify-center px-4 py-3 bg-indigo-50 text-indigo-700 rounded-md hover:bg-indigo-100 transition">
195
+ <i class="fas fa-sitemap mr-2"></i> Detect Structure
196
+ </button>
197
+ <button id="detectPaginationBtn" class="flex items-center justify-center px-4 py-3 bg-pink-50 text-pink-700 rounded-md hover:bg-pink-100 transition">
198
+ <i class="fas fa-copy mr-2"></i> Detect Pagination
199
+ </button>
200
+ </div>
201
+ </div>
202
+ </div>
203
+
204
+ <!-- Right Panel - Results and Helper Mode -->
205
+ <div class="md:col-span-2 space-y-6">
206
+ <!-- Output Console -->
207
+ <div class="bg-white rounded-lg shadow h-full">
208
+ <div class="p-4 border-b border-gray-200">
209
+ <h2 class="text-xl font-semibold text-gray-800 flex items-center">
210
+ <i class="fas fa-terminal mr-2 text-gray-500"></i>
211
+ Ingestion Console
212
+ </h2>
213
+ </div>
214
+ <div class="p-4">
215
+ <div id="consoleOutput" class="h-64 overflow-y-auto scrollbar-hide bg-gray-50 rounded-md p-3 text-sm text-gray-700 font-mono space-y-2">
216
+ <div class="text-gray-400">Ready to begin API ingestion process...</div>
217
+ </div>
218
+ </div>
219
+ <div class="p-4 border-t border-gray-200 flex justify-between">
220
+ <button id="startIngestionBtn" class="px-4 py-2 bg-green-600 text-white rounded-md hover:bg-green-700 transition flex items-center">
221
+ <i class="fas fa-play mr-2"></i> Start Ingestion
222
+ </button>
223
+ <button id="helperModeBtn" class="px-4 py-2 bg-indigo-600 text-white rounded-md hover:bg-indigo-700 transition hidden flex items-center">
224
+ <i class="fas fa-robot mr-2"></i> Enter Helper Mode
225
+ </button>
226
+ </div>
227
+ </div>
228
+
229
+ <!-- Detected Information -->
230
+ <div id="detectedInfo" class="bg-white rounded-lg shadow hidden overflow-hidden">
231
+ <div class="p-4 border-b border-gray-200 bg-amber-50">
232
+ <h2 class="text-xl font-semibold text-gray-800 flex items-center justify-between">
233
+ <span><i class="fas fa-info-circle mr-2 text-amber-500"></i> Detected Information</span>
234
+ <button id="closeDetectedInfo" class="text-gray-400 hover:text-gray-600">
235
+ <i class="fas fa-times"></i>
236
+ </button>
237
+ </h2>
238
+ </div>
239
+ <div class="p-4">
240
+ <div class="json-viewer text-gray-300 p-4 overflow-auto max-h-60">
241
+ <pre id="detectedJson">No information detected yet.</pre>
242
+ </div>
243
+ </div>
244
+ </div>
245
+ </div>
246
+ </div>
247
+ </div>
248
+
249
+ <!-- Helper Mode Modal -->
250
+ <div id="helperModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
251
+ <div class="bg-white rounded-lg shadow-xl w-full max-w-4xl max-h-[90vh] flex flex-col">
252
+ <div class="p-4 border-b border-gray-200 bg-indigo-50">
253
+ <h2 class="text-xl font-semibold text-gray-800">
254
+ <i class="fas fa-robot mr-2 text-indigo-500"></i> API Helper Mode
255
+ </h2>
256
+ </div>
257
+ <div class="flex-1 overflow-hidden flex flex-col">
258
+ <div id="chatContainer" class="flex-1 overflow-y-auto p-4 space-y-4 scrollbar-hide bg-gray-50">
259
+ <div class="flex justify-start">
260
+ <div class="max-w-[80%] bg-indigo-100 text-gray-800 p-3 rounded-lg">
261
+ I've successfully ingested the API documentation. How can I help you work with this API?
262
+ </div>
263
+ </div>
264
+ </div>
265
+ <div class="p-4 border-t border-gray-200">
266
+ <div class="flex">
267
+ <input type="text" id="userQuery" placeholder="Ask me anything about this API..." class="flex-grow px-4 py-2 border border-gray-300 rounded-l-md focus:ring-indigo-500 focus:border-indigo-500">
268
+ <button id="sendQueryBtn" class="px-4 py-2 bg-indigo-600 text-white rounded-r-md hover:bg-indigo-700 transition">
269
+ <i class="fas fa-paper-plane"></i>
270
+ </button>
271
+ </div>
272
+ </div>
273
+ </div>
274
+ <div class="p-4 border-t border-gray-200 flex justify-end">
275
+ <button id="exitHelperBtn" class="px-4 py-2 bg-gray-200 text-gray-800 rounded-md hover:bg-gray-300 transition">
276
+ Exit Helper Mode
277
+ </button>
278
+ </div>
279
+ </div>
280
+ </div>
281
+
282
+ <script>
283
+ // DOM Elements
284
+ const apiUrlInput = document.getElementById('apiUrl');
285
+ const detectBtn = document.getElementById('detectBtn');
286
+ const detectAuthBtn = document.getElementById('detectAuthBtn');
287
+ const authOptions = document.getElementById('authOptions');
288
+ const authDetails = document.getElementById('authDetails');
289
+ const consoleOutput = document.getElementById('consoleOutput');
290
+ const startIngestionBtn = document.getElementById('startIngestionBtn');
291
+ const helperModeBtn = document.getElementById('helperModeBtn');
292
+ const detectedInfo = document.getElementById('detectedInfo');
293
+ const detectedJson = document.getElementById('detectedJson');
294
+ const closeDetectedInfo = document.getElementById('closeDetectedInfo');
295
+ const helperModal = document.getElementById('helperModal');
296
+ const exitHelperBtn = document.getElementById('exitHelperBtn');
297
+ const userQuery = document.getElementById('userQuery');
298
+ const sendQueryBtn = document.getElementById('sendQueryBtn');
299
+ const chatContainer = document.getElementById('chatContainer');
300
+
301
+ // Detection buttons
302
+ const detectMethodsBtn = document.getElementById('detectMethodsBtn');
303
+ const detectProtocolBtn = document.getElementById('detectProtocolBtn');
304
+ const detectStructureBtn = document.getElementById('detectStructureBtn');
305
+ const detectPaginationBtn = document.getElementById('detectPaginationBtn');
306
+
307
+ // Auth type radio buttons
308
+ const authRadios = document.querySelectorAll('input[name="authType"]');
309
+ const apiKeyAuth = document.getElementById('apiKeyAuth');
310
+ const oauthAuth = document.getElementById('oauthAuth');
311
+ const basicAuth = document.getElementById('basicAuth');
312
+
313
+ // Detect API URL
314
+ detectBtn.addEventListener('click', () => {
315
+ const url = apiUrlInput.value.trim();
316
+ if (!url) {
317
+ logToConsole('Please enter a valid API URL', 'error');
318
+ return;
319
+ }
320
+
321
+ logToConsole(`Detecting API at: ${url}`, 'info');
322
+ apiUrlInput.disabled = true;
323
+ detectBtn.disabled = true;
324
+ detectBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-1"></i> Detecting...';
325
+
326
+ // Simulate API detection
327
+ setTimeout(() => {
328
+ logToConsole('API endpoint detected successfully', 'success');
329
+ detectBtn.innerHTML = '<i class="fas fa-check mr-1"></i> Detected';
330
+ detectAuthBtn.disabled = false;
331
+ authOptions.classList.remove('hidden');
332
+
333
+ // Enable all detection buttons
334
+ [detectMethodsBtn, detectProtocolBtn, detectStructureBtn, detectPaginationBtn].forEach(btn => {
335
+ btn.disabled = false;
336
+ });
337
+ }, 2000);
338
+ });
339
+
340
+ // Detect authentication type
341
+ detectAuthBtn.addEventListener('click', () => {
342
+ logToConsole('Detecting authentication method...', 'info');
343
+ detectAuthBtn.disabled = true;
344
+ detectAuthBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> Detecting...';
345
+
346
+ // Simulate auth detection
347
+ setTimeout(() => {
348
+ logToConsole('Authentication method detected: API Key', 'success');
349
+ detectAuthBtn.classList.add('hidden');
350
+ authOptions.classList.remove('hidden');
351
+ authDetails.classList.remove('hidden');
352
+ document.getElementById('apiKey').checked = true;
353
+ apiKeyAuth.classList.remove('hidden');
354
+ }, 1500);
355
+ });
356
+
357
+ // Handle auth type selection
358
+ authRadios.forEach(radio => {
359
+ radio.addEventListener('change', () => {
360
+ apiKeyAuth.classList.add('hidden');
361
+ oauthAuth.classList.add('hidden');
362
+ basicAuth.classList.add('hidden');
363
+
364
+ if (radio.value === 'apiKey') {
365
+ apiKeyAuth.classList.remove('hidden');
366
+ } else if (radio.value === 'oauth') {
367
+ oauthAuth.classList.remove('hidden');
368
+ } else if (radio.value === 'basic') {
369
+ basicAuth.classList.remove('hidden');
370
+ }
371
+ });
372
+ });
373
+
374
+ // Detection buttons
375
+ detectMethodsBtn.addEventListener('click', () => simulateDetection('API call methods', 'GET, POST, PUT, DELETE available'));
376
+ detectProtocolBtn.addEventListener('click', () => simulateDetection('API protocol', 'REST API detected'));
377
+ detectStructureBtn.addEventListener('click', () => simulateDetection('API structure', 'Hierarchical resource structure detected'));
378
+ detectPaginationBtn.addEventListener('click', () => simulateDetection('Pagination method', 'Offset-based pagination detected'));
379
+
380
+ // Start ingestion process
381
+ startIngestionBtn.addEventListener('click', () => {
382
+ const url = apiUrlInput.value.trim();
383
+ if (!url) {
384
+ logToConsole('Please configure the API first', 'error');
385
+ return;
386
+ }
387
+
388
+ logToConsole('Starting API ingestion process...', 'info');
389
+ startIngestionBtn.disabled = true;
390
+ startIngestionBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> Processing...';
391
+
392
+ // Simulate ingestion process
393
+ setTimeout(() => {
394
+ logToConsole('Discovering API endpoints...', 'processing');
395
+ }, 1000);
396
+
397
+ setTimeout(() => {
398
+ logToConsole('Analyzing request/response patterns...', 'processing');
399
+ }, 3000);
400
+
401
+ setTimeout(() => {
402
+ logToConsole('Extracting documentation...', 'processing');
403
+ }, 5000);
404
+
405
+ setTimeout(() => {
406
+ logToConsole('Identifying relationships between endpoints...', 'processing');
407
+ }, 8000);
408
+
409
+ setTimeout(() => {
410
+ logToConsole('Successfully ingested API documentation!', 'success');
411
+ startIngestionBtn.classList.add('hidden');
412
+ helperModeBtn.classList.remove('hidden');
413
+
414
+ // Show sample detected info
415
+ const sampleData = {
416
+ api: {
417
+ baseUrl: url,
418
+ authentication: "API Key (X-API-KEY in header)",
419
+ endpoints: [
420
+ {
421
+ path: "/users",
422
+ methods: ["GET", "POST"],
423
+ description: "Manage user accounts",
424
+ parameters: {
425
+ GET: {
426
+ limit: "number",
427
+ offset: "number"
428
+ },
429
+ POST: {
430
+ name: "string",
431
+ email: "string"
432
+ }
433
+ }
434
+ },
435
+ {
436
+ path: "/users/{id}",
437
+ methods: ["GET", "PUT", "DELETE"],
438
+ description: "Specific user operations"
439
+ }
440
+ ],
441
+ pagination: "offset-based (limit/offset)",
442
+ rateLimiting: "100 requests/minute"
443
+ }
444
+ };
445
+
446
+ detectedJson.textContent = JSON.stringify(sampleData, null, 2);
447
+ showDetectedInfo();
448
+ }, 10000);
449
+ });
450
+
451
+ // Helper mode
452
+ helperModeBtn.addEventListener('click', () => {
453
+ helperModal.classList.remove('hidden');
454
+ });
455
+
456
+ exitHelperBtn.addEventListener('click', () => {
457
+ helperModal.classList.add('hidden');
458
+ });
459
+
460
+ // Close detected info
461
+ closeDetectedInfo.addEventListener('click', () => {
462
+ detectedInfo.classList.add('hidden');
463
+ });
464
+
465
+ // Chat functionality
466
+ sendQueryBtn.addEventListener('click', sendMessage);
467
+ userQuery.addEventListener('keypress', (e) => {
468
+ if (e.key === 'Enter') sendMessage();
469
+ });
470
+
471
+ function sendMessage() {
472
+ const message = userQuery.value.trim();
473
+ if (!message) return;
474
+
475
+ // Add user message
476
+ addMessage('user', message);
477
+ userQuery.value = '';
478
+
479
+ // Simulate AI response
480
+ setTimeout(() => {
481
+ const responses = [
482
+ "For that functionality, you'll want to use the /users endpoint with a POST method.",
483
+ "The API documentation shows that you can use pagination with limit and offset parameters.",
484
+ "I can generate sample code for you to call this endpoint in JavaScript."
485
+ ];
486
+
487
+ const randomResponse = responses[Math.floor(Math.random() * responses.length)];
488
+ addMessage('ai', randomResponse);
489
+ }, 1000);
490
+ }
491
+
492
+ // Utility functions
493
+ function simulateDetection(name, result) {
494
+ const btn = event.target;
495
+ btn.disabled = true;
496
+ const originalText = btn.innerHTML;
497
+ btn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i>';
498
+
499
+ setTimeout(() => {
500
+ logToConsole(`${name} detected: ${result}`, 'success');
501
+ btn.innerHTML = originalText;
502
+ }, 2000);
503
+ }
504
+
505
+ function logToConsole(message, type = 'info') {
506
+ const timestamp = new Date().toLocaleTimeString();
507
+ let icon, color;
508
+
509
+ switch(type) {
510
+ case 'error':
511
+ icon = '<i class="fas fa-exclamation-circle text-red-500 mr-2"></i>';
512
+ color = 'text-red-600';
513
+ break;
514
+ case 'success':
515
+ icon = '<i class="fas fa-check-circle text-green-500 mr-2"></i>';
516
+ color = 'text-green-600';
517
+ break;
518
+ case 'processing':
519
+ icon = '<i class="fas fa-spinner fa-spin text-blue-500 mr-2"></i>';
520
+ color = 'text-blue-600';
521
+ break;
522
+ default:
523
+ icon = '<i class="fas fa-info-circle text-gray-500 mr-2"></i>';
524
+ color = 'text-gray-600';
525
+ }
526
+
527
+ const entry = document.createElement('div');
528
+ entry.className = 'flex items-start';
529
+ entry.innerHTML = `
530
+ <span class="text-xs text-gray-400 mr-2">[${timestamp}]</span>
531
+ <span class="${color}">${icon}</span>
532
+ <span class="${color} flex-1">${message}</span>
533
+ `;
534
+ consoleOutput.appendChild(entry);
535
+ consoleOutput.scrollTop = consoleOutput.scrollHeight;
536
+ }
537
+
538
+ function showDetectedInfo() {
539
+ detectedInfo.classList.remove('hidden');
540
+ }
541
+
542
+ function addMessage(sender, text) {
543
+ const messageDiv = document.createElement('div');
544
+
545
+ if (sender === 'user') {
546
+ messageDiv.className = 'flex justify-end';
547
+ messageDiv.innerHTML = `
548
+ <div class="max-w-[80%] bg-blue-600 text-white p-3 rounded-lg">
549
+ ${text}
550
+ </div>
551
+ `;
552
+ } else {
553
+ messageDiv.className = 'flex justify-start';
554
+ messageDiv.innerHTML = `
555
+ <div class="max-w-[80%] bg-indigo-100 text-gray-800 p-3 rounded-lg">
556
+ ${text}
557
+ </div>
558
+ `;
559
+ }
560
+
561
+ chatContainer.appendChild(messageDiv);
562
+ chatContainer.scrollTop = chatContainer.scrollHeight;
563
+ }
564
+ </script>
565
+ <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=aegisceo/apiingest-lite" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
566
+ </html>
prompts.txt ADDED
@@ -0,0 +1 @@
 
 
1
+ I want to create a simple but reliable And adaptable API Ingestion Application for LLMs with a clean minimalized ui that will allow you to define several attributes or options Like what's the end point of the API and do we already have authentication credentials to upload in the form of json or anything else, How far down should the api learning agent go, etc. The idea is that I can point this application at any API, ingest the instructions into my LLM, and, in an automated fashion trust that the large language model is going to determine the structure of the site crawl the site code pull down anything out of the source that they can sna that's helpful. The app should query the user for all fields that change and are normally manually set. Of the UI should have a space for the API URL , it should be able to detect the method for Interacting with the API, It should use protocol and site structure detecting logic so that it can achieve functional pagination (where necesarry) and walk throug the rest of the Do humans containing information that form the functionality of that api. maybe there should be a detect authentication method and detect api call method button or buttons in the ui to ensure everything is the way it should be before trying to launch the helper portion of the app. Once the model has fully ingested the API documentation, exmaples, and methods available it should ask if you want to switch to helper mode. In helper mode a natrural language conversation about what you want to design and build or achieve using the newly ingested API could be. 2 / 2 qwen2.5-coder-14b-instruct-abliterated The app will have a UI that allows users to input an API URL, detect authentication methods, API call methods, and pagination logic. The application should query for any user-provided credentials and then ingest the API documentation and examples.