bellingcat/auto-archiver-setup-tool
1
0
Fork 0
mirror of https://github.com/bellingcat/auto-archiver-setup-tool.git synced 2026-06-12 05:28:36 +03:00
Code Issues Packages Projects Releases Wiki Activity

final updates before release

Browse Source
This commit is contained in:
msramalho
2025-02-17 16:21:44 +00:00
parent e45c4726a9
commit ebe7286ce2
18 changed files with 6884 additions and 6285 deletions
Download Patch File Download Diff File Expand all files Collapse all files

187
src/views/ArchiveUrlView.vue
View File

@@ -3,13 +3,16 @@
<WelcomeCard />
<v-container class="pane" v-if="user?.active && featureEnabled">
<v-card>
<v-card-title class="text-center">
Archive a single URL
</v-card-title>
<v-card-title class="text-center"> Archive a single URL </v-card-title>
<v-card-text>
<v-row>
<v-col cols="12">
<v-text-field v-model="url" label="URL" required :rules="[urlValidator]"></v-text-field>
<v-text-field
v-model="url"
label="URL"
required
:rules="[urlValidator]"
></v-text-field>
</v-col>
<v-col cols="12" md="4">
<v-radio-group v-model="public" inline>
@@ -18,11 +21,25 @@
</v-radio-group>
</v-col>
<v-col cols="12" md="4">
<v-select v-model="group" label="Group" :items="availableGroups" density="compact"></v-select>
<v-select
v-model="group"
label="Group"
:items="availableGroups"
density="compact"
></v-select>
</v-col>
<v-col cols="12" md="4" class="text-right">
<v-btn @click="archiveUrl" color="teal"
:disabled="!validUrl || loadingArchive || (group == 'please select') || maxedOutMBs || maxedOutURLs">
<v-btn
@click="archiveUrl"
color="teal"
:disabled="
!validUrl ||
loadingArchive ||
group == 'please select' ||
maxedOutMBs ||
maxedOutURLs
"
>
Archive
</v-btn>
</v-col>
@@ -30,49 +47,97 @@
<v-row>
<v-col cols="12">
<p v-if="loadingArchive">
<v-progress-circular color="teal" indeterminate></v-progress-circular>
Archive in progress <span v-if="taskId">task id = <code>{{ taskId }}</code></span>
<v-progress-circular
color="teal"
indeterminate
></v-progress-circular>
Archive in progress
<span v-if="taskId"
>task id = <code>{{ taskId }}</code></span
>
</p>
<v-alert color="success" icon="mdi-information" v-if="archiveResult">
<v-alert
color="success"
icon="mdi-information"
v-if="archiveResult"
>
Archived successfully with id {{ archiveResult.id }}
<span v-if="urlFromResult"> available <a :href="urlFromResult" target="_blank">here</a>.</span>
<span v-if="urlFromResult">
available
<a :href="urlFromResult" target="_blank">here</a>.</span
>
<span v-if="!urlFromResult">no archived content to show.</span>
</v-alert>
<v-alert color="warning" icon="mdi-alert" v-if="archiveFailure">
Failure: {{ archiveFailure }}
</v-alert>
<p v-if="validUrl">
You can <strong v-if="archiveFailure">still</strong> <router-link
:to="`/archives?url=${encodeURIComponent(url)}`" target="_blank"><v-icon>mdi-open-in-new</v-icon> search
for
archives</router-link> of
this URL.
You can <strong v-if="archiveFailure">still</strong>
<router-link
:to="`/archives?url=${encodeURIComponent(url)}`"
target="_blank"
><v-icon>mdi-open-in-new</v-icon> search for
archives</router-link
>
of this URL.
</p>
</v-col>
<v-col cols="12" sm="12" class="pt-0" v-if="group != 'please select'">
<span>
<code>{{ group }}</code><br />
<code>{{ group }}</code
><br />
<span class="text-medium-emphasis mb-1">
{{ groupPermissions.description }}
</span>
<ul>
<li>
Monthly URLs: <strong>{{ groupUsage.monthly_urls || 0 }}</strong>
Monthly URLs:
<strong>{{ groupUsage.monthly_urls || 0 }}</strong>
out of
<strong>{{ displayPermissionValue(groupPermissions?.max_monthly_urls, " URLs") }}</strong>
<v-chip v-if="maxedOutURLs" label class="ml-2" color="red" density="comfortable" size="small">maxed
out</v-chip>
<strong>{{
displayPermissionValue(
groupPermissions?.max_monthly_urls,
" URLs"
)
}}</strong>
<v-chip
v-if="maxedOutURLs"
label
class="ml-2"
color="red"
density="comfortable"
size="small"
>maxed out</v-chip
>
</li>
<li>
Monthly MBs:
<strong>{{ groupUsage.monthly_mbs || 0 }}</strong>
out of
<strong>{{ displayPermissionValue(groupPermissions?.max_monthly_mbs, " MBs") }}</strong>
<v-chip v-if="maxedOutMBs" label class="ml-2" color="red" density="comfortable" size="small">maxed
out</v-chip>
<strong>{{
displayPermissionValue(
groupPermissions?.max_monthly_mbs,
" MBs"
)
}}</strong>
<v-chip
v-if="maxedOutMBs"
label
class="ml-2"
color="red"
density="comfortable"
size="small"
>maxed out</v-chip
>
</li>
<li>We will store archives for: <strong>{{
displayPermissionValue(groupPermissions?.max_archive_lifespan_months, " months") }}</strong>
<li>
We will store archives for:
<strong>{{
displayPermissionValue(
groupPermissions?.max_archive_lifespan_months,
" months"
)
}}</strong>
</li>
</ul>
</span>
@@ -80,7 +145,12 @@
</v-row>
</v-card-text>
</v-card>
<SnackBar :message="snackbarMessage" :show="snackbar" :color="snackbarColor" @update:show="snackbar = $event" />
<SnackBar
:message="snackbarMessage"
:show="snackbar"
:color="snackbarColor"
@update:show="snackbar = $event"
/>
</v-container>
</template>
@@ -93,11 +163,13 @@ import WelcomeCard from "@/components/WelcomeCard.vue";
export default {
name: "ArchiveUrlView",
components: {
SnackBar, PermissionNeeded, WelcomeCard
SnackBar,
PermissionNeeded,
WelcomeCard,
},
data() {
return {
url: "",
url: this.$route.query.url || "",
public: false,
group: "please select",
loadingArchive: false,
@@ -131,8 +203,8 @@ export default {
availableGroups() {
const permissions = this.$store.state.user?.permissions || {};
return Object.keys(permissions)
.filter(group => group !== "all" && permissions[group].archive_url)
.map(g => ({ title: g, value: g }));
.filter((group) => group !== "all" && permissions[group].archive_url)
.map((g) => ({ title: g, value: g }));
},
globalUsage() {
return this.$store.state.user?.usage || {};
@@ -151,21 +223,28 @@ export default {
},
maxedOutMBs() {
if (this.groupPermissions.max_monthly_mbs === -1) return false;
return this.groupUsage.monthly_mbs >= this.groupPermissions.max_monthly_mbs;
return (
this.groupUsage.monthly_mbs >= this.groupPermissions.max_monthly_mbs
);
},
maxedOutURLs() {
if (this.groupPermissions.max_monthly_urls === -1) return false;
return this.groupUsage.monthly_urls >= this.groupPermissions.max_monthly_urls;
return (
this.groupUsage.monthly_urls >= this.groupPermissions.max_monthly_urls
);
},
},
watch: {
url(val) {
url(_val) {
this.archiveResult = null;
this.archiveFailure = null;
this.taskId = null;
if (this.loadingArchive) {
this.loadingArchive = false;
this.showSnackbar("Your previous archive will run in the background.", "yellow");
this.showSnackbar(
"Your previous archive will run in the background.",
"yellow"
);
}
},
},
@@ -192,20 +271,23 @@ export default {
group_id: this.group,
public: this.public,
tags: [],
})
}),
})
.then(response => {
.then((response) => {
if (!response.ok) {
throw new Error(`API error: ${response.statusText}`);
}
return response.json();
})
.then(res => {
.then((res) => {
this.taskId = res.id;
this.showSnackbar(`Your URL is being archived with id ${this.taskId}!`, "green");
this.showSnackbar(
`Your URL is being archived with id ${this.taskId}!`,
"green"
);
this.pollForArchiveResults();
})
.catch(error => {
.catch((error) => {
console.error("/archive ", error);
this.showSnackbar(`Unable to archive URL: ${error.message}`);
this.loadingArchive = false;
@@ -222,12 +304,15 @@ export default {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${this.$store.state.access_token}`,
}
},
})
.then(response => response.json())
.then(task => {
.then((response) => response.json())
.then((task) => {
if (task.status === "SUCCESS") {
this.showSnackbar(`URL archived successfully with id ${task.id}!`, "green");
this.showSnackbar(
`URL archived successfully with id ${task.id}!`,
"green"
);
this.loadingArchive = false;
this.archiveResult = task;
this.taskId = task.id;
@@ -240,18 +325,22 @@ export default {
setTimeout(poll, 5000); // Poll every 5 seconds
}
})
.catch(error => {
.catch((error) => {
console.error("/task ", error);
this.showSnackbar(`Error checking archive status: ${error.message}`);
this.showSnackbar(
`Error checking archive status: ${error.message}`
);
this.loadingArchive = false;
});
};
poll();
},
displayPermissionValue(value, extraWord) {
if (value === undefined) { return "not set"; }
if (value === undefined) {
return "not set";
}
return value == -1 ? "no limit" : value + extraWord;
}
},
},
};
</script>
</script>