mirror of
https://github.com/4ev-link/4ev.link.git
synced 2026-01-13 16:18:05 +00:00
Feat: UI support for seized links
This commit is contained in:
40
dash.html
40
dash.html
@@ -194,6 +194,16 @@
|
|||||||
x-text="'4ev.link/' + editingSlug"
|
x-text="'4ev.link/' + editingSlug"
|
||||||
></p>
|
></p>
|
||||||
|
|
||||||
|
<template x-if="seized">
|
||||||
|
<div class="bg-rose-50 border border-rose-200 text-rose-900 p-4 rounded-md mb-6 text-xs sm:text-sm flex items-start gap-3">
|
||||||
|
<i data-lucide="alert-triangle" class="w-5 h-5 text-rose-600 shrink-0"></i>
|
||||||
|
<div>
|
||||||
|
<p class="font-bold">This link has been seized.</p>
|
||||||
|
<p class="mt-1">It currently redirects to a takedown notice. Updates and deletion are disabled.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<form @submit.prevent="updateLink" class="space-y-4 text-sm">
|
<form @submit.prevent="updateLink" class="space-y-4 text-sm">
|
||||||
<div>
|
<div>
|
||||||
<label
|
<label
|
||||||
@@ -206,9 +216,10 @@
|
|||||||
x-model="destination_url"
|
x-model="destination_url"
|
||||||
type="text"
|
type="text"
|
||||||
id="editUrl"
|
id="editUrl"
|
||||||
|
:disabled="seized"
|
||||||
placeholder="example.com/new-destination"
|
placeholder="example.com/new-destination"
|
||||||
required
|
required
|
||||||
class="w-full p-3 bg-slate-50 border border-slate-300 rounded-md focus:outline-none focus:ring-2 focus:ring-slate-900/10 focus:border-slate-400 transition text-xs sm:text-sm"
|
class="w-full p-3 bg-slate-50 border border-slate-300 rounded-md focus:outline-none focus:ring-2 focus:ring-slate-900/10 focus:border-slate-400 transition text-xs sm:text-sm disabled:opacity-60 disabled:cursor-not-allowed"
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-center justify-between py-2">
|
<div class="flex items-center justify-between py-2">
|
||||||
@@ -217,9 +228,10 @@
|
|||||||
</span>
|
</span>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@click="analyticsEnabled=!analyticsEnabled;fetchAnalytics()"
|
@click="if(!seized){analyticsEnabled=!analyticsEnabled;fetchAnalytics()}"
|
||||||
|
:disabled="seized"
|
||||||
:class="analyticsEnabled ? 'bg-slate-900' : 'bg-slate-200'"
|
:class="analyticsEnabled ? 'bg-slate-900' : 'bg-slate-200'"
|
||||||
class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2"
|
class="relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-slate-500 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed"
|
||||||
role="switch"
|
role="switch"
|
||||||
:aria-checked="analyticsEnabled"
|
:aria-checked="analyticsEnabled"
|
||||||
>
|
>
|
||||||
@@ -229,7 +241,11 @@
|
|||||||
></span>
|
></span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="turnstile-container my-4 flex justify-center"></div>
|
|
||||||
|
<template x-if="!seized">
|
||||||
|
<div class="turnstile-container my-4 flex justify-center"></div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<p
|
<p
|
||||||
x-text="error"
|
x-text="error"
|
||||||
x-show="error"
|
x-show="error"
|
||||||
@@ -238,7 +254,7 @@
|
|||||||
<div class="flex gap-3">
|
<div class="flex gap-3">
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
:disabled="loading"
|
:disabled="loading || seized"
|
||||||
class="flex-1 py-3 font-semibold rounded-lg text-white bg-slate-900 hover:bg-black transition-colors flex items-center justify-center disabled:opacity-50 disabled:cursor-not-allowed text-xs sm:text-sm"
|
class="flex-1 py-3 font-semibold rounded-lg text-white bg-slate-900 hover:bg-black transition-colors flex items-center justify-center disabled:opacity-50 disabled:cursor-not-allowed text-xs sm:text-sm"
|
||||||
>
|
>
|
||||||
<span x-show="!loading">Update</span>
|
<span x-show="!loading">Update</span>
|
||||||
@@ -251,7 +267,7 @@
|
|||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@click="deleteLink"
|
@click="deleteLink"
|
||||||
:disabled="loading"
|
:disabled="loading || seized"
|
||||||
class="px-6 py-3 font-semibold rounded-lg text-white bg-rose-600 hover:bg-rose-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed text-xs sm:text-sm"
|
class="px-6 py-3 font-semibold rounded-lg text-white bg-rose-600 hover:bg-rose-700 transition-colors disabled:opacity-50 disabled:cursor-not-allowed text-xs sm:text-sm"
|
||||||
>
|
>
|
||||||
Delete
|
Delete
|
||||||
@@ -531,6 +547,7 @@
|
|||||||
return{
|
return{
|
||||||
destination_url:"",
|
destination_url:"",
|
||||||
analyticsEnabled:!1,
|
analyticsEnabled:!1,
|
||||||
|
seized:!1,
|
||||||
analytics:[],
|
analytics:[],
|
||||||
loadingAnalytics:!1,
|
loadingAnalytics:!1,
|
||||||
loading:!1,
|
loading:!1,
|
||||||
@@ -545,9 +562,9 @@
|
|||||||
async loadDataForSlug(t){
|
async loadDataForSlug(t){
|
||||||
this.destination_url="",
|
this.destination_url="",
|
||||||
this.analyticsEnabled=!1,
|
this.analyticsEnabled=!1,
|
||||||
|
this.seized=!1,
|
||||||
this.analytics=[],
|
this.analytics=[],
|
||||||
this.error="",
|
this.error="";
|
||||||
this.renderTurnstile();
|
|
||||||
try{
|
try{
|
||||||
const s=await fetch(`/api/links/get?slug=${t}`);
|
const s=await fetch(`/api/links/get?slug=${t}`);
|
||||||
if(!s.ok)
|
if(!s.ok)
|
||||||
@@ -557,7 +574,11 @@
|
|||||||
? i.destination_url
|
? i.destination_url
|
||||||
: `https://${i.destination_url}`;
|
: `https://${i.destination_url}`;
|
||||||
this.analyticsEnabled=i.analytics_enabled||!1;
|
this.analyticsEnabled=i.analytics_enabled||!1;
|
||||||
if(this.analyticsEnabled){
|
this.seized=i.seized||!1;
|
||||||
|
|
||||||
|
if(!this.seized) this.renderTurnstile();
|
||||||
|
|
||||||
|
if(this.analyticsEnabled && !this.seized){
|
||||||
this.loadingAnalytics=!0;
|
this.loadingAnalytics=!0;
|
||||||
try{
|
try{
|
||||||
const a=await fetch(`/api/analytics/get?slug=${t}`);
|
const a=await fetch(`/api/analytics/get?slug=${t}`);
|
||||||
@@ -678,3 +699,4 @@
|
|||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user