copilot-swe-agent[bot]
204000aabc
Resolve 3 merge conflicts and renumber the automation_hooks migration to follow main's migration chain (036_add_document_translation_fields). Conflicts resolved: - app/api/__init__.py: add automation_router alongside main's new routers - app/utils/settings_service.py: add automation_hooks_enabled alongside compliance_enabled - tests/conftest.py: add AutomationHook alongside AuditLog/ComplianceTemplate imports Migration renumbered: - 027_add_automation_hooks → 037_add_automation_hooks - down_revision: 026_add_scheduled_jobs → 036_add_document_translation_fields Co-authored-by: christianlouis <361235+christianlouis@users.noreply.github.com>
450 lines
20 KiB
HTML
450 lines
20 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}{{ _("shared.page_title") }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div x-data="sharedLinks()" x-init="init(); loadLinks()" class="container mx-auto px-4 py-8 max-w-5xl">
|
|
<header class="mb-8">
|
|
<h1 class="text-2xl font-bold text-gray-900 dark:text-white flex items-center gap-2">
|
|
<i class="fas fa-share-alt text-blue-500" aria-hidden="true"></i>
|
|
{{ _("shared.heading") }}
|
|
</h1>
|
|
<p class="mt-2 text-gray-600 dark:text-gray-400 text-sm leading-relaxed max-w-2xl">
|
|
{{ _("shared.subtitle") }}
|
|
</p>
|
|
</header>
|
|
|
|
<!-- Create link section -->
|
|
<section class="bg-white dark:bg-gray-800 shadow rounded-lg p-6 mb-6" aria-labelledby="create-link-heading">
|
|
<h2 id="create-link-heading" class="text-lg font-semibold text-gray-900 dark:text-white mb-4">{{ _("shared.create_heading") }}</h2>
|
|
|
|
<form @submit.prevent="createLink()" class="space-y-4">
|
|
<!-- File ID -->
|
|
<div class="flex flex-col sm:flex-row gap-3 items-start sm:items-end">
|
|
<div class="flex-1">
|
|
<label for="file-id-input" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
|
|
{{ _("shared.file_id_label") }} <span class="text-red-500" aria-hidden="true">*</span>
|
|
</label>
|
|
<input
|
|
id="file-id-input"
|
|
type="number"
|
|
x-model.number="newLink.file_id"
|
|
placeholder="{{ _('shared.file_id_placeholder') }}"
|
|
required
|
|
min="1"
|
|
class="w-full px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm
|
|
focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-white text-sm"
|
|
aria-required="true"
|
|
/>
|
|
<p class="mt-1 text-xs text-gray-500 dark:text-gray-400">
|
|
{{ _("shared.file_id_help_pre") }} <a href="/files" class="underline hover:text-blue-600">{{ _("shared.files_link") }}</a> {{ _("shared.file_id_help_post") }}
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Label (optional) -->
|
|
<div class="flex-1">
|
|
<label for="link-label-input" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
|
|
{{ _("shared.label_label") }} <span class="text-gray-400 font-normal">({{ _("shared.optional") }})</span>
|
|
</label>
|
|
<input
|
|
id="link-label-input"
|
|
type="text"
|
|
x-model="newLink.label"
|
|
placeholder="{{ _('shared.label_placeholder') }}"
|
|
maxlength="255"
|
|
class="w-full px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm
|
|
focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-white text-sm"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Expiry + max views row -->
|
|
<div class="flex flex-col sm:flex-row gap-4">
|
|
<!-- Expiry -->
|
|
<div class="flex-1">
|
|
<label for="expires-select" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
|
|
{{ _("shared.expiry_label") }}
|
|
</label>
|
|
<select
|
|
id="expires-select"
|
|
x-model.number="newLink.expires_in_hours"
|
|
class="w-full px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm
|
|
focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-white text-sm"
|
|
>
|
|
<option :value="null">{{ _("shared.expiry_never") }}</option>
|
|
<option value="1">{{ _("shared.expiry_1h") }}</option>
|
|
<option value="6">{{ _("shared.expiry_6h") }}</option>
|
|
<option value="12">{{ _("shared.expiry_12h") }}</option>
|
|
<option value="24">{{ _("shared.expiry_24h") }}</option>
|
|
<option value="72">{{ _("shared.expiry_3d") }}</option>
|
|
<option value="168">{{ _("shared.expiry_7d") }}</option>
|
|
<option value="336">{{ _("shared.expiry_14d") }}</option>
|
|
<option value="720">{{ _("shared.expiry_30d") }}</option>
|
|
</select>
|
|
</div>
|
|
|
|
<!-- Max views -->
|
|
<div class="flex-1">
|
|
<label for="max-views-input" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
|
|
{{ _("shared.max_downloads_label") }} <span class="text-gray-400 font-normal">({{ _("shared.optional") }})</span>
|
|
</label>
|
|
<input
|
|
id="max-views-input"
|
|
type="number"
|
|
x-model.number="newLink.max_views"
|
|
placeholder="{{ _('shared.unlimited_placeholder') }}"
|
|
min="1"
|
|
max="10000"
|
|
class="w-full px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm
|
|
focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-white text-sm"
|
|
/>
|
|
</div>
|
|
|
|
<!-- Password -->
|
|
<div class="flex-1">
|
|
<label for="link-password-input" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">
|
|
{{ _("shared.password_label") }} <span class="text-gray-400 font-normal">({{ _("shared.optional") }})</span>
|
|
</label>
|
|
<input
|
|
id="link-password-input"
|
|
type="password"
|
|
x-model="newLink.password"
|
|
placeholder="{{ _('shared.password_placeholder') }}"
|
|
maxlength="128"
|
|
autocomplete="new-password"
|
|
class="w-full px-4 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm
|
|
focus:outline-none focus:ring-2 focus:ring-blue-500 dark:bg-gray-700 dark:text-white text-sm"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Error message -->
|
|
<template x-if="createError">
|
|
<p class="text-sm text-red-600 dark:text-red-400" role="alert" x-text="createError"></p>
|
|
</template>
|
|
|
|
<div class="flex justify-end">
|
|
<button
|
|
type="submit"
|
|
:disabled="creating || !newLink.file_id"
|
|
class="inline-flex items-center px-5 py-2 bg-blue-600 text-white text-sm font-medium rounded-md
|
|
hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:opacity-50
|
|
transition-colors"
|
|
style="min-height:40px; min-width:44px;"
|
|
>
|
|
<i class="fas fa-share-alt mr-2" aria-hidden="true"></i>
|
|
<span x-text="creating ? '{{ _('shared.creating') }}' : '{{ _('shared.create_btn') }}'"></span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
|
|
<!-- Newly created link display -->
|
|
<template x-if="newlyCreatedLink">
|
|
<div class="mt-4 bg-green-50 dark:bg-green-900/30 border border-green-300 dark:border-green-700 rounded-lg p-4" role="alert">
|
|
<div class="flex items-start gap-3">
|
|
<i class="fas fa-check-circle text-green-600 dark:text-green-400 mt-0.5 text-lg" aria-hidden="true"></i>
|
|
<div class="flex-1">
|
|
<p class="font-semibold text-green-800 dark:text-green-200 text-sm">{{ _("shared.link_created") }}</p>
|
|
<p class="text-green-700 dark:text-green-300 text-xs mt-1">
|
|
{{ _("shared.link_created_help") }}
|
|
</p>
|
|
<div class="mt-3 flex items-center gap-2">
|
|
<code
|
|
class="flex-1 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded px-3 py-2
|
|
text-sm font-mono text-gray-900 dark:text-gray-100 select-all break-all"
|
|
x-text="newlyCreatedLink.share_url"
|
|
></code>
|
|
<button
|
|
type="button"
|
|
@click="copyLink()"
|
|
class="inline-flex items-center px-3 py-2 bg-gray-100 dark:bg-gray-700 border border-gray-300
|
|
dark:border-gray-600 rounded-md text-sm font-medium text-gray-700 dark:text-gray-200
|
|
hover:bg-gray-200 dark:hover:bg-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500
|
|
transition-colors"
|
|
style="min-height:40px; min-width:44px;"
|
|
:aria-label="copied ? '{{ _('common.copied') }}' : '{{ _('shared.copy_link_aria') }}'"
|
|
>
|
|
<i :class="copied ? 'fas fa-check text-green-600' : 'fas fa-copy'" aria-hidden="true"></i>
|
|
<span class="ml-1 hidden sm:inline" x-text="copied ? '{{ _('common.copied') }}' : '{{ _('common.copy') }}'"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</section>
|
|
|
|
<!-- Active links table -->
|
|
<section class="bg-white dark:bg-gray-800 shadow rounded-lg p-6" aria-labelledby="links-heading">
|
|
<div class="flex items-center justify-between mb-4">
|
|
<h2 id="links-heading" class="text-lg font-semibold text-gray-900 dark:text-white">
|
|
{{ _("shared.your_links") }}
|
|
<span
|
|
x-show="links.length > 0"
|
|
class="ml-2 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200"
|
|
x-text="links.length"
|
|
aria-label="{{ _('shared.links_count_aria') }}"
|
|
></span>
|
|
</h2>
|
|
<button
|
|
@click="loadLinks()"
|
|
type="button"
|
|
class="text-sm text-blue-600 hover:underline focus:outline-none focus:ring-2 focus:ring-blue-500 rounded"
|
|
aria-label="{{ _('shared.refresh_aria') }}"
|
|
>
|
|
<i class="fas fa-sync-alt mr-1" aria-hidden="true"></i>{{ _("common.refresh") }}
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Loading state -->
|
|
<template x-if="loading">
|
|
<p class="text-sm text-gray-400 dark:text-gray-500 py-4 text-center">
|
|
<i class="fas fa-spinner fa-spin mr-2" aria-hidden="true"></i>{{ _("common.loading") }}
|
|
</p>
|
|
</template>
|
|
|
|
<!-- Empty state -->
|
|
<template x-if="!loading && links.length === 0">
|
|
<div class="text-center py-10 text-gray-400 dark:text-gray-500">
|
|
<i class="fas fa-share-alt text-3xl mb-3" aria-hidden="true"></i>
|
|
<p class="text-sm">{{ _("shared.no_links") }}</p>
|
|
</div>
|
|
</template>
|
|
|
|
<!-- Links list -->
|
|
<template x-if="!loading && links.length > 0">
|
|
<div class="overflow-x-auto">
|
|
<table class="min-w-full divide-y divide-gray-200 dark:divide-gray-700 text-sm" aria-label="{{ _('shared.table_aria') }}">
|
|
<thead>
|
|
<tr class="text-left text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider">
|
|
<th scope="col" class="pb-3 pr-4">{{ _("shared.col_file_label") }}</th>
|
|
<th scope="col" class="pb-3 pr-4">{{ _("shared.col_link") }}</th>
|
|
<th scope="col" class="pb-3 pr-4">{{ _("shared.col_expiry") }}</th>
|
|
<th scope="col" class="pb-3 pr-4">{{ _("shared.col_views") }}</th>
|
|
<th scope="col" class="pb-3 pr-4">{{ _("common.status") }}</th>
|
|
<th scope="col" class="pb-3">{{ _("common.actions") }}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-gray-100 dark:divide-gray-700">
|
|
<template x-for="link in links" :key="link.id">
|
|
<tr class="hover:bg-gray-50 dark:hover:bg-gray-750">
|
|
<!-- File / Label -->
|
|
<td class="py-3 pr-4 max-w-xs">
|
|
<p class="font-medium text-gray-800 dark:text-gray-200 truncate" x-text="link.original_filename || ('File #' + link.file_id)"></p>
|
|
<p x-show="link.label" class="text-xs text-gray-500 dark:text-gray-400 truncate" x-text="link.label"></p>
|
|
<p x-show="link.has_password" class="text-xs text-yellow-600 dark:text-yellow-400 mt-0.5">
|
|
<i class="fas fa-lock text-xs" aria-hidden="true"></i> {{ _("shared.password_protected") }}
|
|
</p>
|
|
</td>
|
|
<!-- Link -->
|
|
<td class="py-3 pr-4">
|
|
<div class="flex items-center gap-1">
|
|
<code class="text-xs text-blue-600 dark:text-blue-400 truncate max-w-[140px]" x-text="link.share_url"></code>
|
|
<button
|
|
type="button"
|
|
@click="copyUrl(link.share_url)"
|
|
class="p-1 text-gray-400 hover:text-gray-600 dark:hover:text-gray-300 focus:outline-none focus:ring-1 focus:ring-blue-500 rounded"
|
|
aria-label="{{ _('shared.copy_link_aria') }}"
|
|
title="{{ _('shared.copy_link_title') }}"
|
|
style="min-height:32px;min-width:32px;"
|
|
>
|
|
<i class="fas fa-copy text-xs" aria-hidden="true"></i>
|
|
</button>
|
|
<a
|
|
:href="link.share_url"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="p-1 text-gray-400 hover:text-blue-600 focus:outline-none focus:ring-1 focus:ring-blue-500 rounded"
|
|
aria-label="{{ _('shared.open_link_aria') }}"
|
|
title="{{ _('shared.open_in_new_tab') }}"
|
|
style="min-height:32px;min-width:32px;"
|
|
>
|
|
<i class="fas fa-external-link-alt text-xs" aria-hidden="true"></i>
|
|
</a>
|
|
</div>
|
|
</td>
|
|
<!-- Expiry -->
|
|
<td class="py-3 pr-4 whitespace-nowrap text-gray-600 dark:text-gray-400">
|
|
<span x-text="formatExpiry(link)"></span>
|
|
</td>
|
|
<!-- Views -->
|
|
<td class="py-3 pr-4 whitespace-nowrap text-gray-600 dark:text-gray-400">
|
|
<span x-text="link.view_count"></span>
|
|
<span x-show="link.max_views" x-text="' / ' + link.max_views"></span>
|
|
</td>
|
|
<!-- Status badge -->
|
|
<td class="py-3 pr-4 whitespace-nowrap">
|
|
<template x-if="!link.is_active">
|
|
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-700 dark:bg-red-900/40 dark:text-red-300">
|
|
{{ _("shared.status_revoked") }}
|
|
</span>
|
|
</template>
|
|
<template x-if="link.is_active && isExpired(link)">
|
|
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700 dark:bg-yellow-900/40 dark:text-yellow-300">
|
|
{{ _("shared.status_expired") }}
|
|
</span>
|
|
</template>
|
|
<template x-if="link.is_active && isViewLimitReached(link)">
|
|
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-orange-100 text-orange-700 dark:bg-orange-900/40 dark:text-orange-300">
|
|
{{ _("shared.status_limit_reached") }}
|
|
</span>
|
|
</template>
|
|
<template x-if="link.is_active && !isExpired(link) && !isViewLimitReached(link)">
|
|
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-700 dark:bg-green-900/40 dark:text-green-300">
|
|
{{ _("shared.status_active") }}
|
|
</span>
|
|
</template>
|
|
</td>
|
|
<!-- Actions -->
|
|
<td class="py-3 whitespace-nowrap">
|
|
<button
|
|
x-show="link.is_active"
|
|
type="button"
|
|
@click="revokeLink(link.id)"
|
|
class="inline-flex items-center px-3 py-1.5 text-xs font-medium text-red-600 dark:text-red-400
|
|
border border-red-300 dark:border-red-700 rounded hover:bg-red-50 dark:hover:bg-red-900/20
|
|
focus:outline-none focus:ring-2 focus:ring-red-500 transition-colors"
|
|
style="min-height:32px;min-width:44px;"
|
|
:aria-label="'{{ _('shared.revoke_aria_prefix') }} ' + (link.original_filename || '{{ _('shared.revoke_aria_file') }}')"
|
|
>
|
|
<i class="fas fa-ban mr-1" aria-hidden="true"></i> {{ _("shared.revoke_btn") }}
|
|
</button>
|
|
<span x-show="!link.is_active" class="text-xs text-gray-400 dark:text-gray-500">—</span>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</template>
|
|
</section>
|
|
</div>
|
|
|
|
<script>
|
|
function sharedLinks() {
|
|
return {
|
|
links: [],
|
|
loading: false,
|
|
creating: false,
|
|
createError: null,
|
|
newlyCreatedLink: null,
|
|
copied: false,
|
|
newLink: {
|
|
file_id: null,
|
|
label: '',
|
|
expires_in_hours: null,
|
|
max_views: null,
|
|
password: '',
|
|
},
|
|
|
|
init() {
|
|
// Pre-fill file_id from URL query parameter ?file_id=N
|
|
const params = new URLSearchParams(window.location.search);
|
|
const fid = params.get('file_id');
|
|
if (fid) this.newLink.file_id = parseInt(fid, 10);
|
|
},
|
|
|
|
async loadLinks() {
|
|
this.loading = true;
|
|
try {
|
|
const resp = await fetch('/api/shared-links/', {
|
|
headers: { 'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]')?.content || '' },
|
|
});
|
|
if (!resp.ok) throw new Error('Failed to load links');
|
|
this.links = await resp.json();
|
|
} catch (err) {
|
|
console.error('Failed to load shared links', err);
|
|
} finally {
|
|
this.loading = false;
|
|
}
|
|
},
|
|
|
|
async createLink() {
|
|
this.creating = true;
|
|
this.createError = null;
|
|
this.newlyCreatedLink = null;
|
|
try {
|
|
const body = {
|
|
file_id: this.newLink.file_id,
|
|
};
|
|
if (this.newLink.label && this.newLink.label.trim()) body.label = this.newLink.label.trim();
|
|
if (this.newLink.expires_in_hours) body.expires_in_hours = parseInt(this.newLink.expires_in_hours);
|
|
if (this.newLink.max_views) body.max_views = parseInt(this.newLink.max_views);
|
|
if (this.newLink.password && this.newLink.password.trim()) body.password = this.newLink.password;
|
|
|
|
const resp = await fetch('/api/shared-links/', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]')?.content || '',
|
|
},
|
|
body: JSON.stringify(body),
|
|
});
|
|
|
|
if (!resp.ok) {
|
|
const err = await resp.json().catch(() => ({}));
|
|
this.createError = err.detail || 'Failed to create link';
|
|
return;
|
|
}
|
|
|
|
const data = await resp.json();
|
|
this.newlyCreatedLink = data;
|
|
this.newLink = { file_id: null, label: '', expires_in_hours: null, max_views: null, password: '' };
|
|
await this.loadLinks();
|
|
} finally {
|
|
this.creating = false;
|
|
}
|
|
},
|
|
|
|
async revokeLink(id) {
|
|
if (!confirm('Revoke this link? Recipients will no longer be able to use it.')) return;
|
|
try {
|
|
const resp = await fetch(`/api/shared-links/${id}`, {
|
|
method: 'DELETE',
|
|
headers: { 'X-CSRF-Token': document.querySelector('meta[name="csrf-token"]')?.content || '' },
|
|
});
|
|
if (!resp.ok) {
|
|
const err = await resp.json().catch(() => ({}));
|
|
alert(err.detail || 'Failed to revoke link');
|
|
return;
|
|
}
|
|
await this.loadLinks();
|
|
} catch (err) {
|
|
alert('Error revoking link');
|
|
}
|
|
},
|
|
|
|
copyLink() {
|
|
if (!this.newlyCreatedLink) return;
|
|
navigator.clipboard.writeText(this.newlyCreatedLink.share_url).then(() => {
|
|
this.copied = true;
|
|
setTimeout(() => { this.copied = false; }, 2000);
|
|
});
|
|
},
|
|
|
|
copyUrl(url) {
|
|
navigator.clipboard.writeText(url).then(() => {
|
|
// Brief visual feedback handled by the button icon change.
|
|
});
|
|
},
|
|
|
|
formatExpiry(link) {
|
|
if (!link.expires_at) return 'Never';
|
|
const d = new Date(link.expires_at);
|
|
return d.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' }) +
|
|
' ' + d.toLocaleTimeString(undefined, { hour: '2-digit', minute: '2-digit' });
|
|
},
|
|
|
|
isExpired(link) {
|
|
if (!link.expires_at) return false;
|
|
return new Date(link.expires_at) < new Date();
|
|
},
|
|
|
|
isViewLimitReached(link) {
|
|
return link.max_views !== null && link.view_count >= link.max_views;
|
|
},
|
|
};
|
|
}
|
|
</script>
|
|
{% endblock %}
|