boltstore 0.5.1 → 0.6.0

package/src/admin-ui/pages/DataBrowser.vue

@@ -1,310 +0,0 @@
-<template>
-  <div>
-    <div v-if="!hasApplication" class="card">
-      <div class="card-header">
-        <h2>Data Browser</h2>
-      </div>
-      <p class="text-muted">Select an application from the sidebar to browse its data.</p>
-    </div>
-
-    <div v-else>
-      <!-- Table Selector -->
-      <div class="card">
-        <div class="card-header">
-          <h2>Data Browser</h2>
-          <div class="header-actions">
-            <select v-model="selectedTable" class="form-input" @change="onTableChange" style="width:220px">
-              <option value="">-- Select Table --</option>
-              <option value="_users">_users</option>
-              <option v-for="c in collections" :key="c.name" :value="c.name">{{ c.name }}</option>
-            </select>
-            <button v-if="selectedTable" class="btn btn-primary" :disabled="!selectedTable" @click="openNewRecord">+ Record</button>
-          </div>
-        </div>
-
-        <div class="toolbar">
-          <input v-model="filterText" type="text" class="form-input" placeholder="Filter records..."
-                 style="max-width:400px" @keyup.enter="loadRecords" />
-          <button class="btn btn-secondary btn-sm" @click="loadRecords">Refresh</button>
-        </div>
-
-        <div v-if="loading" class="text-muted"><span class="spinner"></span> Loading...</div>
-        <div v-else-if="error" class="error">{{ error }}</div>
-
-        <table v-if="selectedTable && tableColumns.length" class="data-table">
-          <thead>
-            <tr>
-              <th v-for="col in displayColumns" :key="col.name">{{ col.name }}</th>
-              <th>Actions</th>
-            </tr>
-          </thead>
-          <tbody>
-            <tr v-for="record in records" :key="record.id">
-              <td v-for="col in displayColumns" :key="col.name">
-                <span v-if="editingId === record.id">
-                  <input v-if="typeof record[col.name] === 'number'" v-model.number="editingRecord[col.name]" class="form-input" type="number" />
-                  <input v-else v-model="editingRecord[col.name]" class="form-input" type="text" />
-                </span>
-                <span v-else>{{ formatValue(record[col.name]) }}</span>
-              </td>
-              <td>
-                <div v-if="editingId === record.id" class="inline-actions">
-                  <button class="btn btn-primary btn-sm" @click="saveEdit">Save</button>
-                  <button class="btn btn-secondary btn-sm" @click="cancelEdit">Cancel</button>
-                </div>
-                <div v-else class="inline-actions">
-                  <button class="btn btn-secondary btn-sm" @click="startEdit(record)">Edit</button>
-                  <button class="btn btn-danger btn-sm" @click="deleteRecord(record.id)">Delete</button>
-                </div>
-              </td>
-            </tr>
-            <tr v-if="records.length === 0 && !loading">
-              <td :colspan="displayColumns.length + 1" class="text-muted">No records yet.</td>
-            </tr>
-          </tbody>
-        </table>
-
-        <p v-else-if="selectedTable && !loading && !tableColumns.length" class="text-muted">No columns defined.</p>
-        <p v-else-if="!selectedTable" class="text-muted">Select a table to browse data.</p>
-      </div>
-
-      <!-- New Record Modal -->
-      <div v-if="showNewModal" class="modal-overlay" @click.self="showNewModal = false">
-        <div class="modal-content">
-          <h3>New Record in {{ selectedTable }}</h3>
-          <form @submit.prevent="createRecord">
-            <div class="form-group">
-              <label>JSON Data
-                <textarea v-model="newRecordJson" class="form-input" rows="8" required></textarea>
-              </label>
-            </div>
-            <p v-if="modalError" class="error">{{ modalError }}</p>
-            <div class="btn-row">
-              <button type="submit" class="btn btn-primary" :disabled="modalLoading">Create</button>
-              <button type="button" class="btn btn-secondary" @click="showNewModal = false">Cancel</button>
-            </div>
-          </form>
-        </div>
-      </div>
-
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref, onMounted, computed, watch } from 'vue';
-import { useApplicationStore } from '../stores/application';
-import { api } from '../api/client';
-
-const applicationStore = useApplicationStore();
-const hasApplication = computed(() => applicationStore.hasApplicationSelected);
-
-interface Collection {
-  name: string;
-  fields: { name: string; type: string; required?: boolean }[];
-}
-
-interface RecordItem {
-  id: string;
-  [key: string]: unknown;
-}
-
-const collections = ref<Collection[]>([]);
-const selectedTable = ref('');
-const records = ref<RecordItem[]>([]);
-const tableColumns = ref<{ name: string; required?: boolean }[]>([]);
-const loading = ref(false);
-const error = ref('');
-const filterText = ref('');
-const showNewModal = ref(false);
-const modalLoading = ref(false);
-const modalError = ref('');
-const newRecordJson = ref('{}');
-const editingId = ref<string | null>(null);
-const editingRecord = ref<Record<string, unknown>>({});
-
-const isSystemTable = computed(() => selectedTable.value.startsWith('_'));
-
-const displayColumns = computed(() => tableColumns.value.filter(c => c.name !== 'password_hash'));
-
-function openNewRecord() {
-  const data: Record<string, string> = {};
-  for (const col of tableColumns.value) {
-    if (col.name === 'id' || col.name === 'created' || col.name === 'updated') continue;
-    if (col.name === 'password_hash') {
-      data['password'] = col.required ? '<required>' : '';
-      continue;
-    }
-    data[col.name] = col.required ? '<required>' : '';
-  }
-  newRecordJson.value = JSON.stringify(data, null, 2);
-  showNewModal.value = true;
-}
-
-function formatValue(v: unknown): string {
-  if (v === null || v === undefined) return '';
-  if (typeof v === 'boolean') return v ? 'true' : 'false';
-  if (typeof v === 'object') return JSON.stringify(v);
-  return String(v);
-}
-
-async function loadCollections() {
-  try {
-    const res = await api.get<Collection[]>('/api/collections');
-    collections.value = (res ?? []).filter((c) => !c.name.startsWith('_'));
-  } catch (err: any) {
-    error.value = err.message ?? 'Failed to load collections';
-  }
-}
-
-async function onTableChange() {
-  if (!selectedTable.value) {
-    tableColumns.value = [];
-    records.value = [];
-    return;
-  }
-  await loadColumns();
-  await loadRecords();
-}
-
-async function loadColumns() {
-  if (!selectedTable.value) return;
-  try {
-    const res = await api.get<Collection>(`/api/collections/${selectedTable.value}`);
-    const cols: { name: string; required?: boolean }[] = [
-      { name: 'id' }, { name: 'created' }, { name: 'updated' },
-    ];
-    for (const f of res.fields ?? []) {
-      if (!cols.some(c => c.name === f.name)) {
-        cols.push({ name: f.name, required: f.required });
-      }
-    }
-    tableColumns.value = cols;
-  } catch {
-    tableColumns.value = [];
-  }
-}
-
-async function loadRecords() {
-  if (!selectedTable.value) return;
-  loading.value = true;
-  error.value = '';
-  try {
-    let url = `/api/collections/${selectedTable.value}/records`;
-    if (filterText.value) {
-      url += `?filter=${encodeURIComponent(filterText.value)}`;
-    }
-    const res = await api.get<{ items: RecordItem[] }>(url);
-    records.value = res.items ?? [];
-    // If no records, ensure columns are still shown
-    if (records.value.length === 0 && tableColumns.value.length === 0) {
-      await loadColumns();
-    }
-  } catch (err: any) {
-    error.value = err.message ?? 'Failed to load records';
-  } finally {
-    loading.value = false;
-  }
-}
-
-async function createRecord() {
-  modalLoading.value = true;
-  modalError.value = '';
-  try {
-    let data: Record<string, unknown>;
-    try {
-      data = JSON.parse(newRecordJson.value);
-    } catch {
-      modalError.value = 'Invalid JSON';
-      modalLoading.value = false;
-      return;
-    }
-    // Map UI-only fields to DB columns
-    if (data.password !== undefined) {
-      data.password_hash = data.password;
-      delete data.password;
-    }
-    await api.post(`/api/collections/${selectedTable.value}/records`, { data });
-    showNewModal.value = false;
-    newRecordJson.value = '{}';
-    await loadRecords();
-  } catch (err: any) {
-    modalError.value = err.message ?? 'Failed to create record';
-  } finally {
-    modalLoading.value = false;
-  }
-}
-
-function startEdit(record: RecordItem) {
-  editingId.value = record.id;
-  editingRecord.value = { ...record };
-}
-
-function cancelEdit() {
-  editingId.value = null;
-  editingRecord.value = {};
-}
-
-async function saveEdit() {
-  if (!editingId.value || !selectedTable.value) return;
-  try {
-    const data = { ...editingRecord.value };
-    delete data.id;
-    delete data.created;
-    delete data.updated;
-    await api.patch(`/api/collections/${selectedTable.value}/records/${editingId.value}`, { data });
-    editingId.value = null;
-    await loadRecords();
-  } catch (err: any) {
-    error.value = err.message ?? 'Failed to update record';
-  }
-}
-
-async function deleteRecord(id: string) {
-  if (!confirm('Delete this record?')) return;
-  try {
-    await api.del(`/api/collections/${selectedTable.value}/records/${id}`);
-    await loadRecords();
-  } catch (err: any) {
-    error.value = err.message ?? 'Failed to delete record';
-  }
-}
-
-onMounted(() => {
-  loadCollections();
-});
-
-watch(() => applicationStore.selectedApplicationId, () => {
-  selectedTable.value = '';
-  tableColumns.value = [];
-  records.value = [];
-  if (applicationStore.hasApplicationSelected) {
-    loadCollections();
-  }
-});
-</script>
-
-<style scoped>
-.header-actions {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-}
-.toolbar {
-  display: flex;
-  gap: 8px;
-  margin-bottom: 16px;
-  align-items: center;
-}
-.inline-actions {
-  display: flex;
-  gap: 6px;
-}
-.field-check {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 0.85em;
-  color: var(--text-secondary);
-}
-</style>

package/src/admin-ui/pages/Docs.vue

@@ -1,40 +0,0 @@
-<template>
-  <div class="card">
-    <div class="card-header">
-      <h2>Documentation</h2>
-    </div>
-    <div class="docs-frame">
-      <p class="text-muted">
-        Full documentation is available at
-        <a href="https://docs.boltstore.dev" target="_blank" rel="noopener">docs.boltstore.dev</a>.
-      </p>
-      <div class="docs-links">
-        <a class="btn btn-primary" href="https://docs.boltstore.dev" target="_blank" rel="noopener">
-          Open Docs →
-        </a>
-        <a class="btn btn-secondary" href="https://docs.boltstore.dev/guide/getting-started" target="_blank" rel="noopener">
-          Getting Started
-        </a>
-        <a class="btn btn-secondary" href="https://docs.boltstore.dev/api/reference" target="_blank" rel="noopener">
-          API Reference
-        </a>
-        <a class="btn btn-secondary" href="https://docs.boltstore.dev/sdk/client" target="_blank" rel="noopener">
-          SDK Guide
-        </a>
-      </div>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.docs-frame {
-  padding: 24px;
-}
-
-.docs-links {
-  display: flex;
-  gap: 12px;
-  flex-wrap: wrap;
-  margin-top: 16px;
-}
-</style>