Adding alerted scene to stashes.

This commit is contained in:
DebaucheryLibrarian 2021-04-29 01:45:01 +02:00
parent 4806b0aa41
commit 3f55b90ab8
8 changed files with 77 additions and 46 deletions

View File

@ -85,14 +85,14 @@
<Tooltip v-if="me"> <Tooltip v-if="me">
<div <div
class="header-button header-notifications" class="header-button header-notifications"
:class="{ unseen: unseenNotifications.length > 0 }" :class="{ unseen: unseenNotificationsCount > 0 }"
> >
<Icon icon="bell2" /> <Icon icon="bell2" />
<span <span
v-if="unseenNotifications.length > 0" v-if="unseenNotificationsCount > 0"
class="notifications-count" class="notifications-count"
>{{ unseenNotifications.length }}</span> >{{ unseenNotificationsCount }}</span>
</div> </div>
<template v-slot:tooltip> <template v-slot:tooltip>
@ -115,8 +115,6 @@
</template> </template>
</Tooltip> </Tooltip>
<Search class="search-full" />
<Tooltip <Tooltip
class="search-compact" class="search-compact"
:open="searching" :open="searching"
@ -139,6 +137,8 @@
/> />
</template> </template>
</Tooltip> </Tooltip>
<Search class="search-full" />
</div> </div>
</header> </header>
</template> </template>
@ -154,12 +154,8 @@ function me() {
return this.$store.state.auth.user; return this.$store.state.auth.user;
} }
function notifications() { function unseenNotificationsCount() {
return this.$store.state.ui.notifications; return this.$store.state.ui.unseenNotificationsCount;
}
function unseenNotifications() {
return this.$store.state.ui.notifications.filter(notification => !notification.seen);
} }
export default { export default {
@ -178,8 +174,7 @@ export default {
}, },
computed: { computed: {
me, me,
notifications, unseenNotificationsCount,
unseenNotifications,
}, },
}; };
</script> </script>
@ -315,12 +310,12 @@ export default {
} }
.header-account { .header-account {
padding: 1rem 1rem 1rem .75rem; padding: 1rem 1.25rem 1rem .75rem;
} }
.header-notifications { .header-notifications {
position: relative; position: relative;
padding: 1rem .75rem 1rem 1rem; padding: 1rem .75rem;
&.unseen .icon { &.unseen .icon {
fill: var(--primary); fill: var(--primary);
@ -334,7 +329,7 @@ export default {
justify-content: center; justify-content: center;
position: absolute; position: absolute;
bottom: .3rem; bottom: .3rem;
left: .1rem; left: 0;
color: var(--primary); color: var(--primary);
font-size: .6rem; font-size: .6rem;
font-weight: bold; font-weight: bold;

View File

@ -1,13 +1,11 @@
<template> <template>
<div <div class="notifications">
class="notifications"
>
<div class="notifications-header"> <div class="notifications-header">
<h4 class="notifications-title">Notifications</h4> <h4 class="notifications-title">Notifications</h4>
<div class="notifications-actions"> <div class="notifications-actions">
<Icon <Icon
v-if="unseenNotifications.length > 0" v-if="unseenNotificationsCount > 0"
v-tooltip="'Mark all as seen'" v-tooltip="'Mark all as seen'"
icon="checkmark" icon="checkmark"
@click="checkNotifications" @click="checkNotifications"
@ -40,7 +38,7 @@
:key="`notification-${notification.id}`" :key="`notification-${notification.id}`"
:class="{ unseen: !notification.seen }" :class="{ unseen: !notification.seen }"
class="notification" class="notification"
@click="checkNotification(notification.id)" @click="checkNotification(notification.id, true)"
> >
<router-link <router-link
:to="`/scene/${notification.scene.id}/${notification.scene.slug}`" :to="`/scene/${notification.scene.id}/${notification.scene.slug}`"
@ -100,14 +98,14 @@
v-tooltip="'Mark as seen'" v-tooltip="'Mark as seen'"
icon="checkmark" icon="checkmark"
class="notification-check" class="notification-check"
@click.prevent="checkNotification(notification.id)" @click.prevent.stop="checkNotification(notification.id)"
/> />
<Icon <Icon
v-if="notification.alert" v-if="notification.alert"
v-tooltip="`You set an alert for <strong>${notification.alert.tags.map(tag => tag.name).join(', ') || 'all'}</strong> scenes with <strong>${notification.alert.actors.map(actor => actor.name).join(', ') || 'any actor'}</strong> for <strong>${notification.alert.entity?.name || 'any channel'}</strong>`" v-tooltip="`You set an alert for <strong>${notification.alert.tags.map(tag => tag.name).join(', ') || 'all'}</strong> scenes with <strong>${notification.alert.actors.map(actor => actor.name).join(', ') || 'any actor'}</strong> for <strong>${notification.alert.entity?.name || 'any channel'}</strong>`"
icon="question5" icon="question5"
@click.prevent @click.prevent.stop
/> />
</router-link> </router-link>
</li> </li>
@ -123,8 +121,8 @@ function notifications() {
return this.$store.state.ui.notifications; return this.$store.state.ui.notifications;
} }
function unseenNotifications() { function unseenNotificationsCount() {
return this.notifications.filter(notification => !notification.seen); return this.$store.state.ui.unseenNotificationsCount;
} }
async function checkNotifications() { async function checkNotifications() {
@ -132,9 +130,13 @@ async function checkNotifications() {
await this.$store.dispatch('fetchNotifications'); await this.$store.dispatch('fetchNotifications');
} }
async function checkNotification(notificationId) { async function checkNotification(notificationId, blur) {
await this.$store.dispatch('checkNotification', notificationId); await this.$store.dispatch('checkNotification', notificationId);
await this.$store.dispatch('fetchNotifications'); await this.$store.dispatch('fetchNotifications');
if (blur) {
this.events.emit('blur');
}
} }
export default { export default {
@ -148,7 +150,7 @@ export default {
}, },
computed: { computed: {
notifications, notifications,
unseenNotifications, unseenNotificationsCount,
}, },
methods: { methods: {
checkNotifications, checkNotifications,
@ -307,6 +309,7 @@ export default {
.poster { .poster {
width: 6rem; width: 6rem;
height: 3.6rem;
object-fit: cover; object-fit: cover;
object-position: center; object-position: center;
} }

View File

@ -51,6 +51,7 @@ export default {
query: this.$route.query ? this.$route.query.q : null, query: this.$route.query ? this.$route.query.q : null,
}; };
}, },
emits: ['search'],
watch: { watch: {
$route: route, $route: route,
searching, searching,
@ -71,8 +72,8 @@ export default {
flex-grow: 1; flex-grow: 1;
align-items: center; align-items: center;
justify-content: flex-end; justify-content: flex-end;
padding: 0 1rem 0 0;
border-left: solid 1px var(--shadow-hint); border-left: solid 1px var(--shadow-hint);
margin: 0 .25rem 0 0;
&.compact { &.compact {
padding: 0; padding: 0;
@ -92,7 +93,7 @@ export default {
.search-input { .search-input {
height: 100%; height: 100%;
width: 100%; width: 100%;
padding: .5rem 0 .5rem .5rem; padding: .5rem 0 .5rem .75rem;
border: none; border: none;
color: var(--text); color: var(--text);
background: var(--background); background: var(--background);
@ -119,14 +120,20 @@ export default {
} }
} }
&:focus::placeholder { &:focus {
color: var(--shadow-weak); &::placeholder {
color: var(--shadow-weak);
}
& + .search-button:not(:hover) .icon {
fill: var(--shadow);
}
} }
} }
.search-button { .search-button {
height: 100%; height: 100%;
padding: 0 1rem; padding: 0 1.25rem 0 1rem;
background: none; background: none;
border: none; border: none;
margin: .3rem 0 0 0; margin: .3rem 0 0 0;
@ -140,7 +147,7 @@ export default {
cursor: pointer; cursor: pointer;
.icon { .icon {
fill: var(--shadow); fill: var(--primary);
} }
} }
} }

View File

@ -1,6 +1,6 @@
import { get, post, del } from '../api'; import { get, post, del } from '../api';
function initAuthActions(_store, _router) { function initAuthActions(store, _router) {
async function fetchMe({ commit }) { async function fetchMe({ commit }) {
try { try {
const user = await get('/session'); const user = await get('/session');
@ -18,6 +18,7 @@ function initAuthActions(_store, _router) {
const user = await post('/session', credentials); const user = await post('/session', credentials);
commit('setUser', user); commit('setUser', user);
await store.dispatch('fetchNotifications');
return user; return user;
} }

View File

@ -34,7 +34,7 @@ function initUiActions(store, _router) {
return []; return [];
} }
const { notifications } = await graphql(` const { notifications, unseenNotifications } = await graphql(`
query Notifications( query Notifications(
$hasAuth: Boolean! $hasAuth: Boolean!
$userId: Int $userId: Int
@ -76,6 +76,11 @@ function initUiActions(store, _router) {
} }
} }
} }
unseenNotifications: notificationsConnection(
filter: { seen: { equalTo: false } }
) {
totalCount
}
} }
`, { `, {
hasAuth: !!store.state.auth.user, hasAuth: !!store.state.auth.user,
@ -85,7 +90,12 @@ function initUiActions(store, _router) {
const curatedNotifications = notifications.map(notification => curateNotification(notification)); const curatedNotifications = notifications.map(notification => curateNotification(notification));
commit('setNotifications', curatedNotifications); commit('setNotifications', curatedNotifications);
return curatedNotifications; commit('setUnseenNotificationsCount', unseenNotifications.totalCount);
return {
notifications: curatedNotifications,
unseenCount: unseenNotifications.totalCount,
};
} }
async function checkNotification(context, notificationId) { async function checkNotification(context, notificationId) {
@ -198,8 +208,8 @@ function initUiActions(store, _router) {
}); });
return { return {
releases: res.results.map(result => curateRelease(result.release)), releases: res?.results.map(result => curateRelease(result.release)) || [],
actors: res.actors.map(actor => curateActor(actor)), actors: res?.actors.map(actor => curateActor(actor)) || [],
}; };
} }

View File

@ -2,6 +2,10 @@ function setNotifications(state, notifications) {
state.notifications = notifications; state.notifications = notifications;
} }
function setUnseenNotificationsCount(state, count) {
state.unseenNotificationsCount = count;
}
function setTagFilter(state, tagFilter) { function setTagFilter(state, tagFilter) {
state.tagFilter = tagFilter; state.tagFilter = tagFilter;
} }
@ -24,6 +28,7 @@ function setTheme(state, theme) {
export default { export default {
setNotifications, setNotifications,
setUnseenNotificationsCount,
setTagFilter, setTagFilter,
setRange, setRange,
setBatch, setBatch,

View File

@ -12,4 +12,5 @@ export default {
sfw: storedSfw === 'true' || false, sfw: storedSfw === 'true' || false,
theme: storedTheme || deviceTheme, theme: storedTheme || deviceTheme,
notifications: [], notifications: [],
unseenNotificationsCount: 0,
}; };

View File

@ -51,11 +51,11 @@ async function removeAlert(alertId) {
async function notify(scenes) { async function notify(scenes) {
const releases = await knex.raw(` const releases = await knex.raw(`
SELECT alerts.id as alert_id, alerts.notify, alerts.email, releases.id as scene_id, users.id as user_id SELECT alerts.id as alert_id, alerts.notify, alerts.email, releases.id as scene_id, users.id as user_id, COALESCE(json_agg(alerts_stashes.stash_id) FILTER (WHERE alerts_stashes.stash_id IS NOT NULL), '[]') as stashes
FROM releases FROM releases
CROSS JOIN alerts CROSS JOIN alerts
LEFT JOIN users ON users.id = alerts.user_id LEFT JOIN users ON users.id = alerts.user_id
LEFT JOIN releases_tags ON releases_tags.release_id = releases.id LEFT JOIN alerts_stashes ON alerts_stashes.alert_id = alerts.id
/* match updated IDs from input */ /* match updated IDs from input */
WHERE (releases.id = ANY(:sceneIds)) WHERE (releases.id = ANY(:sceneIds))
/* match tags */ /* match tags */
@ -111,15 +111,26 @@ async function notify(scenes) {
sceneIds: scenes.map(scene => scene.id), sceneIds: scenes.map(scene => scene.id),
}); });
const notifications = releases.rows.filter(alert => alert.notify); const notifications = releases.rows
.filter(alert => alert.notify)
await knex('notifications') .map(notification => ({
.insert(notifications.map(notification => ({
user_id: notification.user_id, user_id: notification.user_id,
alert_id: notification.alert_id, alert_id: notification.alert_id,
scene_id: notification.scene_id, scene_id: notification.scene_id,
}));
const stashes = releases.rows
.filter(release => release.stashes.length > 0)
.flatMap(release => release.stashes.map(stash => ({
scene_id: release.scene_id,
stash_id: stash,
}))); })));
await Promise.all([
knex('notifications').insert(notifications),
knex('stashes_scenes').insert(stashes),
]);
return releases.rows; return releases.rows;
} }
@ -133,8 +144,6 @@ async function updateNotification(notificationId, notification, sessionUser) {
} }
async function updateNotifications(notification, sessionUser) { async function updateNotifications(notification, sessionUser) {
console.log(notification, sessionUser.id);
await knex('notifications') await knex('notifications')
.where('user_id', sessionUser.id) .where('user_id', sessionUser.id)
.update({ .update({