Added the ignore API and exposed it via WebUI.

This commit is contained in:
Abdulmhsen B. A. A.
2024-05-30 16:22:40 +03:00
parent c267397b88
commit a1c8caef61
7 changed files with 706 additions and 19 deletions

View File

@@ -74,13 +74,15 @@
</span> </span>
</NuxtLink> </NuxtLink>
<NuxtLink class="navbar-item" to="/ignore" @click.native="showMenu=false">
<span class="icon-text">
<span class="icon"><i class="fas fa-ban"></i></span>
<span>Ignore</span>
</span>
</NuxtLink>
</div> </div>
<div class="navbar-end pr-3"> <div class="navbar-end pr-3">
<div class="navbar-item">
<button class="button is-dark" @click="maskAll = !maskAll" v-tooltip="'Toggle Text Obscure'">
<span class="icon"><i class="fas fa-mask"></i></span>
</button>
</div>
<div class="navbar-item"> <div class="navbar-item">
<button class="button is-dark" @click="selectedTheme = 'light'" v-if="'dark' === selectedTheme" <button class="button is-dark" @click="selectedTheme = 'light'" v-if="'dark' === selectedTheme"
v-tooltip="'Switch to light theme'"> v-tooltip="'Switch to light theme'">
@@ -99,7 +101,7 @@
</div> </div>
</div> </div>
</nav> </nav>
<div :class="{'is-full-mask':maskAll}"> <div>
<div class="columns is-multiline" v-if="showConnection"> <div class="columns is-multiline" v-if="showConnection">
<div class="column is-12 mt-2"> <div class="column is-12 mt-2">
<div class="card"> <div class="card">
@@ -276,7 +278,6 @@ const showConnection = ref(false)
const api_url = useStorage('api_url', window.location.origin) const api_url = useStorage('api_url', window.location.origin)
const api_path = useStorage('api_path', '/v1/api') const api_path = useStorage('api_path', '/v1/api')
const api_token = useStorage('api_token', '') const api_token = useStorage('api_token', '')
const maskAll = useStorage('page_mask', false)
const show_page_tips = useStorage('show_page_tips', true) const show_page_tips = useStorage('show_page_tips', true)
const api_status = ref(false) const api_status = ref(false)

View File

@@ -185,6 +185,7 @@
</template> </template>
<script setup> <script setup>
import 'assets/css/bulma-switch.css'
import request from '~/utils/request.js' import request from '~/utils/request.js'
import {awaitElement, copyText, notification} from '~/utils/index.js' import {awaitElement, copyText, notification} from '~/utils/index.js'
import {useStorage} from '@vueuse/core' import {useStorage} from '@vueuse/core'

427
frontend/pages/ignore.vue Normal file
View File

@@ -0,0 +1,427 @@
<template>
<div class="columns is-multiline">
<div class="column is-12 is-clearfix">
<span id="env_page_title" class="title is-4">Ignored GUIDs</span>
<div class="is-pulled-right">
<div class="field is-grouped">
<p class="control">
<button class="button is-primary" v-tooltip="'Add New Ignore'" @click="toggleForm = !toggleForm">
<span class="icon">
<i class="fas fa-add"></i>
</span>
</button>
</p>
<p class="control">
<button class="button is-info" @click="loadContent">
<span class="icon">
<i class="fas fa-sync"></i>
</span>
</button>
</p>
</div>
</div>
<div class="is-hidden-mobile">
<span class="subtitle">
This page allow you to ignore specific <code>GUID</code> from being processed by the system.
</span>
</div>
</div>
<div class="column is-12" v-if="toggleForm">
<form id="page_form" @submit.prevent="addIgnoreRule">
<div class="card">
<header class="card-header">
<p class="card-header-title is-unselectable is-justify-center">Add Ignore rule</p>
</header>
<div class="card-content">
<div class="field">
<label class="label is-unselectable" for="form_select_backend">Backend</label>
<div class="control has-icons-left">
<div class="select is-fullwidth">
<select id="form_select_backend" v-model="form.backend">
<option value="" disabled>Select Backend</option>
<option v-for="backend in backends" :key="backend.name" :value="backend.name">
{{ backend.name }}
</option>
</select>
</div>
<div class="icon is-left">
<i class="fas fa-server"></i>
</div>
</div>
<p class="help">
<span class="icon-text">
<span class="icon"><i class="fas fa-info"></i></span>
<span>Ignore rules applies to backends, you must select the correct backend you want to ignore the
GUID from</span>
</span>
</p>
</div>
<div class="field">
<label class="label is-unselectable" for="form_select_guid">Provider</label>
<div class="control has-icons-left">
<div class="select is-fullwidth">
<select id="form_select_guid" v-model="form.db">
<option value="" disabled>Select GUID provider</option>
<option v-for="guid in guids" :key="guid.guid" :value="guid.guid">
{{ guid.guid }}
</option>
</select>
</div>
<div class="icon is-left">
<i class="fas fa-database"></i>
</div>
</div>
<p class="help">
<span class="icon"><i class="fas fa-info"></i></span>
<span>You must select the GUID provider that giving you incorrect data.</span>
</p>
</div>
<div class="field">
<label class="label is-unselectable" for="form_ignore_id">GUID Value</label>
<div class="control has-icons-left">
<input class="input" id="form_ignore_id" type="text" v-model="form.id">
<div class="icon is-small is-left"><i class="fas fa-font"></i></div>
</div>
<p class="help">
<span class="icon-text">
<span class="icon"><i class="fas fa-info"></i></span>
<span>The GUID value to ignore.</span>
</span>
</p>
</div>
<div class="field">
<label class="label is-unselectable">Type</label>
<div class="control">
<label class="radio">
<input type="radio" v-model="form.type" value="show">
Show
</label>
<label class="radio">
<input type="radio" v-model="form.type" value="movie">
Movie
</label>
</div>
<p class="help">
<span class="icon"><i class="fas fa-info"></i></span>
<span>What kind of data the <code>GUID value</code> reference?</span>
</p>
</div>
<div class="field">
<label class="label is-unselectable" for="form_scoped">Scope</label>
<div class="control has-icons-left">
<input id="form_scoped" type="checkbox" class="switch is-success" v-model="form.scoped">
<label for="form_scoped">
<template v-if="form.scoped">On (True)</template>
<template v-else>Off (False)</template>
</label>
</div>
<p class="help">
<span class="icon"><i class="fas fa-exclamation"></i></span>
<span>By default, Rules are globally applied to all items from the selected backend, you can limit the
scope, by enabling this option.
</span>
</p>
</div>
<div class="field" v-if="form.scoped">
<label class="label is-unselectable" for="form_scoped_to">Scoped To</label>
<div class="control has-icons-left">
<input class="input" id="form_scoped_to" type="text" v-model="form.scoped_to">
<div class="icon is-small is-left"><i class="fas fa-font"></i></div>
<p class="help">
<span class="icon"><i class="fas fa-info"></i></span>
<span>The id to associate this rule with. The value must be the <code>{{ form.type }}</code> id as
being reported by the backend.</span>
</p>
</div>
</div>
</div>
<div class="card-footer">
<div class="card-footer-item">
<button class="button is-fullwidth is-primary" type="submit" :disabled="false === checkForm">
<span class="icon-text">
<span class="icon"><i class="fas fa-save"></i></span>
<span>Save</span>
</span>
</button>
</div>
<div class="card-footer-item">
<button class="button is-fullwidth is-danger" type="button" @click="cancelForm">
<span class="icon-text">
<span class="icon"><i class="fas fa-cancel"></i></span>
<span>Cancel</span>
</span>
</button>
</div>
</div>
</div>
</form>
</div>
<div class="column is-12" v-if="items">
<div class="columns is-multiline">
<div class="column is-6" v-for="item in items" :key="item.rule">
<div class="card">
<header class="card-header">
<p class="card-header-title is-unselectable is-text-overflow">
<template v-if="item.title">{{ item.title }}</template>
<template v-else>
{{ item.scoped ? 'Unknown title' : '**Global**' }}
</template>
</p>
<span class="card-header-icon">
<span class="icon">
<i class="fas" :class="{'fa-tv':'Show'===item.type,'fa-film': 'Movie' === item.type}"></i>
</span>
</span>
</header>
<div class="card-content">
<div class="columns is-multiline is-mobile">
<div class="column is-6">
<span class="icon-text">
<span class="icon"><i class="fas fa-server"></i></span>
{{ item.backend }}
</span>
</div>
<div class="column is-6 has-text-right">
<strong>Scope:&nbsp;</strong>
<NuxtLink :to="makeItemLink(item)" v-text="item.scoped_to" v-if="item.scoped_to"/>
<template v-else>Global</template>
</div>
<div class="column is-6">
<span class="icon-text">
<span class="icon"><i class="fas fa-database"></i></span>
<span>{{ item.db }}://{{ item.id }}</span>
</span>
</div>
<div class="column is-6 has-text-right">
<span class="icon-text">
<span class="icon"><i class="fas fa-calendar"></i></span>
<span>{{ moment(item.created).fromNow() }}</span>
</span>
</div>
</div>
</div>
<footer class="card-footer">
<div class="card-footer-item">
<button class="button is-fullwidth is-warning" @click="copyText(item.rule)">
<span class="icon-text">
<span class="icon"><i class="fas fa-copy"></i></span>
<span>Copy</span>
</span>
</button>
</div>
<div class="card-footer-item">
<button class="button is-fullwidth is-danger" @click="deleteIgnore(item)">
<span class="icon-text">
<span class="icon"><i class="fas fa-trash"></i></span>
<span>Delete</span>
</span>
</button>
</div>
</footer>
</div>
</div>
</div>
</div>
<div class="column is-12" v-if="items.length < 1">
<Message message_class="is-info" title="Loading..." v-if="isLoading">
<span class="icon-text">
<span class="icon"><i class="fas fa-spinner fa-spin"></i></span>
<span>Request ignore list. Please wait...</span>
</span>
</Message>
<Message message_class="has-background-success-90 has-text-dark" title="Information" v-else>
<span class="icon-text">
<span class="icon"><i class="fas fa-check"></i></span>
<span>
There are no ignore rules currently set. You can add new ignore rules by clicking on the <i
class="fas fa-add"></i> button.
</span>
</span>
</Message>
</div>
<div class="column is-12" v-if="show_page_tips">
<Message title="Tips" message_class="has-background-info-90 has-text-dark">
<button class="delete" @click="show_page_tips=false"></button>
<div class="content">
<ul>
<li>Ignoring specific GUID sometimes helps in preventing incorrect data being added to WatchState, due to
incorrect metadata being provided by backends.
</li>
<li>
<code>GUID</code> means in terms of WatchState is the unique identifier for a specific item in the
external data source.
</li>
<li>To add a new ignore rule click on the <i class="fa fa-add"></i> button.</li>
</ul>
</div>
</Message>
</div>
</div>
</template>
<script setup>
import request from '~/utils/request.js'
import {awaitElement, copyText, notification, stringToRegex} from '~/utils/index.js'
import {useStorage} from '@vueuse/core'
import moment from 'moment'
import 'assets/css/bulma-switch.css'
useHead({title: 'Ignored GUIDs'})
const empty_form = {id: '', type: 'show', backend: '', db: '', scoped: false, scoped_to: null}
const items = ref([])
const toggleForm = ref(false)
const form = ref(JSON.parse(JSON.stringify(empty_form)))
const show_page_tips = useStorage('show_page_tips', true)
const isLoading = ref(false)
const guids = ref([])
const backends = ref([])
const loadContent = async () => {
isLoading.value = true
items.value = []
if (!guids.value.length) {
const guid_response = await request('/system/guids')
guids.value = await guid_response.json()
}
if (!backends.value.length) {
const backends_response = await request('/backends')
backends.value = await backends_response.json()
}
let response, json;
try {
response = await request(`/ignore`)
} catch (e) {
isLoading.value = false
return notification('error', 'Error', e.message)
}
try {
json = await response.json()
} catch (e) {
json = {
error: {
code: response.status,
message: response.statusText
}
}
}
isLoading.value = false
if (!response.ok) {
notification('error', 'Error', `${json.error.code}: ${json.error.message}`)
return
}
items.value = json
}
onMounted(() => loadContent())
const deleteIgnore = async (item) => {
if (!confirm(`Are you sure you want to delete the ignore rule?`)) {
return
}
const response = await request(`/ignore`, {
method: 'DELETE',
body: JSON.stringify({
rule: item.rule
})
})
if (response.ok) {
items.value = items.value.filter(i => i.rule !== item.rule)
notification('success', 'Success', `Environment variable '${item.rule}' successfully deleted.`, 5000)
}
}
const makeItemLink = (item) => {
if (!item?.scoped_to) {
return ''
}
const type = item.type === 'Show' ? 'show' : 'id'
const params = new URLSearchParams();
params.append('perpage', '50')
params.append('page', '1')
params.append('q', `${item.backend}.${type}://${item.scoped_to}`)
params.append('key', 'metadata')
return `/history?${params.toString()}`
}
const addIgnoreRule = async () => {
const val = guids.value.find(g => g.guid === form.value.db)
if (val && val?.validator && val.validator.pattern) {
if (!stringToRegex(val.validator.pattern).test(form.value.id)) {
notification('error', 'Error', `Invalid GUID value, must match the pattern: '${val.validator.pattern}'. Example ${val.validator.example}`, 5000)
return
}
}
try {
const response = await request(`/ignore`, {
method: 'POST',
body: JSON.stringify(form.value)
})
const json = await response.json()
if (!response.ok) {
notification('error', 'Error', `${json.error.code}: ${json.error.message}`, 5000)
return
}
items.value.push(json)
notification('success', 'Success', 'Successfully added new ignore rule.', 5000)
} catch (e) {
notification('error', 'Error', `Request error. ${e.message}`, 5000)
return
}
return cancelForm();
}
const cancelForm = () => {
form.value = JSON.parse(JSON.stringify(empty_form))
toggleForm.value = false
}
watch(toggleForm, (value) => {
if (!value) {
cancelForm()
return;
}
awaitElement('#page_form', (_, el) => el.scrollIntoView({
behavior: 'smooth',
block: 'start',
inline: 'nearest'
}))
});
const checkForm = computed(() => {
const {id, type, backend, db} = form.value
return '' !== id && '' !== type && '' !== backend && '' !== db
})
</script>

View File

@@ -286,4 +286,17 @@ const copyText = (str) => {
notification('success', 'Success', 'Text copied to clipboard.') notification('success', 'Success', 'Text copied to clipboard.')
} }
export {ag_set, ag, humanFileSize, awaitElement, ucFirst, notification, makeGUIDLink, formatDuration, copyText} const stringToRegex = (str) => new RegExp(str.match(/\/(.+)\/.*/)[1], str.match(/\/.+\/(.*)/)[1]);
export {
ag_set,
ag,
humanFileSize,
awaitElement,
ucFirst,
notification,
makeGUIDLink,
formatDuration,
copyText,
stringToRegex
}

199
src/API/Ignore/Index.php Normal file
View File

@@ -0,0 +1,199 @@
<?php
declare(strict_types=1);
namespace App\API\Ignore;
use App\Libs\Attributes\Route\Delete;
use App\Libs\Attributes\Route\Get;
use App\Libs\Attributes\Route\Post;
use App\Libs\Config;
use App\Libs\ConfigFile;
use App\Libs\Container;
use App\Libs\Database\DatabaseInterface as iDB;
use App\Libs\DataUtil;
use App\Libs\Entity\StateInterface as iState;
use App\Libs\Exceptions\RuntimeException;
use App\Libs\HTTP_STATUS;
use PDO;
use Psr\Http\Message\ResponseInterface as iResponse;
use Psr\Http\Message\ServerRequestInterface as iRequest;
use Psr\Http\Message\UriInterface as iUri;
final class Index
{
public const string URL = '%{api.prefix}/ignore';
private array $cache = [];
private PDO $db;
private ConfigFile $config;
public function __construct(iDB $db)
{
$this->db = $db->getPDO();
$this->config = ConfigFile::open(
file: Config::get('path') . '/config/ignore.yaml',
type: 'yaml',
autoCreate: true,
autoBackup: false
);
}
#[Get(self::URL . '[/]', name: 'ignore')]
public function __invoke(iRequest $request): iResponse
{
$response = [];
foreach ($this->config->getAll() as $guid => $date) {
$response[] = $this->ruleAsArray($guid, $date);
}
return api_response(HTTP_STATUS::HTTP_OK, $response);
}
#[Post(self::URL . '[/]', name: 'ignore.add')]
public function addNewRule(iRequest $request): iResponse
{
$params = DataUtil::fromRequest($request);
foreach (['id', 'db', 'backend', 'type'] as $key) {
if (null === $params->get($key)) {
return api_error(r('Missing required parameter: {key}', ['key' => $key]),
HTTP_STATUS::HTTP_BAD_REQUEST);
}
}
$id = r('{type}://{db}:{id}@{backend}?id={scoped_to}', [
'type' => $params->get('type'),
'db' => $params->get('db'),
'id' => $params->get('id'),
'backend' => $params->get('backend'),
'scoped_to' => $params->get('scoped') ? $params->get('scoped_to') : '',
]);
try {
checkIgnoreRule($id);
} catch (RuntimeException $e) {
return api_error($e->getMessage(), HTTP_STATUS::HTTP_BAD_REQUEST);
}
$filtered = (string)makeIgnoreId($id);
$date = time();
if ($this->config->has($id) || $this->config->has($filtered)) {
return api_error(r('Rule already exists: {id}', ['id' => $id]), HTTP_STATUS::HTTP_CONFLICT);
}
$this->config->set($filtered, $date)->persist();
return api_response(HTTP_STATUS::HTTP_OK, $this->ruleAsArray($filtered, $date));
}
#[Delete(self::URL . '[/]', name: 'ignore.delete')]
public function deleteRule(iRequest $request): iResponse
{
$params = DataUtil::fromRequest($request);
if (null === ($rule = $params->get('rule'))) {
return api_error('Missing required parameter: rule', HTTP_STATUS::HTTP_BAD_REQUEST);
}
try {
checkIgnoreRule($rule);
} catch (RuntimeException $e) {
return api_error($e->getMessage(), HTTP_STATUS::HTTP_BAD_REQUEST);
}
$filtered = (string)makeIgnoreId($rule);
if (!$this->config->has($filtered)) {
return api_error(r('Rule does not exist: {rule}', ['rule' => $rule]), HTTP_STATUS::HTTP_NOT_FOUND);
}
$date = $this->config->get($filtered);
$this->config->delete($filtered)->persist();
return api_response(HTTP_STATUS::HTTP_OK, $this->ruleAsArray($filtered, $date));
}
/**
* Gets information about the ignore id.
*
* @param iUri $uri Ignore ID encoded as URL.
*
* @return string|null Return the name of the item or null if not found.
*/
private function getInfo(iUri $uri): string|null
{
if (empty($uri->getQuery())) {
return null;
}
$params = [];
parse_str($uri->getQuery(), $params);
$key = sprintf('%s://%s@%s', $uri->getScheme(), $uri->getHost(), $params['id']);
if (true === array_key_exists($key, $this->cache)) {
return $this->cache[$key];
}
$sql = sprintf(
"SELECT * FROM state WHERE JSON_EXTRACT(metadata, '$.%s.%s') = :id LIMIT 1",
$uri->getHost(),
$uri->getScheme() === iState::TYPE_SHOW ? 'show' : 'id'
);
$stmt = $this->db->prepare($sql);
$stmt->execute(['id' => $params['id']]);
$item = $stmt->fetch(PDO::FETCH_ASSOC);
if (empty($item)) {
$this->cache[$key] = null;
return null;
}
$this->cache[$key] = Container::get(iState::class)->fromArray($item)->getName(
iState::TYPE_SHOW === $uri->getScheme()
);
return $this->cache[$key];
}
private function ruleAsArray(string $guid, int|null $date = null): array
{
$urlParts = parse_url($guid);
$backend = ag($urlParts, 'host');
$type = ag($urlParts, 'scheme');
$db = ag($urlParts, 'user');
$id = ag($urlParts, 'pass');
$scope = ag($urlParts, 'query');
$query = [];
if (null !== $scope) {
parse_str($scope, $query);
}
$rule = makeIgnoreId($guid);
$builder = [
'rule' => (string)$rule,
'id' => $id,
'type' => ucfirst($type),
'backend' => $backend,
'db' => $db,
'title' => null !== $scope ? ($this->getinfo($rule) ?? 'Unknown') : null,
'scoped' => ag_exists($query, 'id'),
'scoped_to' => ag_exists($query, 'id') ? ag($query, 'id') : null,
];
if (null !== $date) {
$builder['created'] = makeDate($date);
}
return $builder;
}
}

36
src/API/System/Guids.php Normal file
View File

@@ -0,0 +1,36 @@
<?php
declare(strict_types=1);
namespace App\API\System;
use App\Libs\Attributes\Route\Get;
use App\Libs\Guid;
use App\Libs\HTTP_STATUS;
use Psr\Http\Message\ResponseInterface as iResponse;
use Psr\Http\Message\ServerRequestInterface as iRequest;
final class Guids
{
public const string URL = '%{api.prefix}/system/guids';
#[Get(self::URL . '[/]', name: 'system.guids')]
public function __invoke(iRequest $request): iResponse
{
$list = [];
$validator = Guid::getValidators();
foreach (Guid::getSupported() as $guid => $type) {
$item = [
'guid' => after($guid, 'guid_'),
'type' => $type,
'validator' => ag($validator, $guid, fn() => new \stdClass()),
];
$list[] = $item;
}
return api_response(HTTP_STATUS::HTTP_OK, $list);
}
}

View File

@@ -21,14 +21,14 @@ use Stringable;
*/ */
final class Guid implements JsonSerializable, Stringable final class Guid implements JsonSerializable, Stringable
{ {
public const GUID_IMDB = 'guid_imdb'; public const string GUID_IMDB = 'guid_imdb';
public const GUID_TVDB = 'guid_tvdb'; public const string GUID_TVDB = 'guid_tvdb';
public const GUID_TMDB = 'guid_tmdb'; public const string GUID_TMDB = 'guid_tmdb';
public const GUID_TVMAZE = 'guid_tvmaze'; public const string GUID_TVMAZE = 'guid_tvmaze';
public const GUID_TVRAGE = 'guid_tvrage'; public const string GUID_TVRAGE = 'guid_tvrage';
public const GUID_ANIDB = 'guid_anidb'; public const string GUID_ANIDB = 'guid_anidb';
public const GUID_YOUTUBE = 'guid_youtube'; public const string GUID_YOUTUBE = 'guid_youtube';
public const GUID_CMDB = 'guid_cmdb'; public const string GUID_CMDB = 'guid_cmdb';
/** /**
* Constant array of supported GUID types. * Constant array of supported GUID types.
* *
@@ -36,7 +36,7 @@ final class Guid implements JsonSerializable, Stringable
* *
* @var array * @var array
*/ */
private const SUPPORTED = [ private const array SUPPORTED = [
Guid::GUID_IMDB => 'string', Guid::GUID_IMDB => 'string',
Guid::GUID_TVDB => 'string', Guid::GUID_TVDB => 'string',
Guid::GUID_TMDB => 'string', Guid::GUID_TMDB => 'string',
@@ -56,7 +56,7 @@ final class Guid implements JsonSerializable, Stringable
* *
* @var array * @var array
*/ */
private const VALIDATE_GUID = [ private const array VALIDATE_GUID = [
Guid::GUID_IMDB => [ Guid::GUID_IMDB => [
'pattern' => '/tt(\d+)/i', 'pattern' => '/tt(\d+)/i',
'example' => 'tt(number)', 'example' => 'tt(number)',
@@ -85,7 +85,7 @@ final class Guid implements JsonSerializable, Stringable
/** /**
* @var string LOOKUP_KEY is how we format external ids to look up a record. * @var string LOOKUP_KEY is how we format external ids to look up a record.
*/ */
private const LOOKUP_KEY = '{db}://{id}'; private const string LOOKUP_KEY = '{db}://{id}';
/** /**
* @var array $data Holds the list of supported external ids. * @var array $data Holds the list of supported external ids.
*/ */
@@ -189,6 +189,16 @@ final class Guid implements JsonSerializable, Stringable
return self::SUPPORTED; return self::SUPPORTED;
} }
/**
* Get validators for external ids.
*
* @return array<string,array{pattern:string, example:string}>
*/
public static function getValidators(): array
{
return self::VALIDATE_GUID;
}
/** /**
* Create new instance from array. * Create new instance from array.
* *