Changed range toggles to links for home and actor pages.

assets/js/actors/actions.js

@@ -5,6 +5,7 @@ import {
     releaseTagsFragment,
 } from '../fragments';
 import { curateRelease } from '../curate';
+import getDateRange from '../get-date-range';
 
 function curateActor(actor) {
     const curatedActor = {
@@ -45,7 +46,9 @@ function curateActor(actor) {
 }
 
 function initActorActions(store, _router) {
-    async function fetchActorBySlug(actorSlug, limit = 100) {
+    async function fetchActorBySlug({ _commit }, { slug, limit = 100, range = 'latest' }) {
+        const { before, after, orderBy } = getDateRange(range);
+
         const { actor } = await graphql(`
             query Actor(
                 $actorSlug: String!
@@ -168,11 +171,11 @@ function initActorActions(store, _router) {
                 }
             }
         `, {
-            actorSlug,
+            actorSlug: slug,
             limit,
-            after: store.getters.after,
-            before: store.getters.before,
-            orderBy: store.getters.orderBy === 'DATE_DESC' ? 'RELEASE_BY_RELEASE_ID__DATE_DESC' : 'RELEASE_BY_RELEASE_ID__DATE_ASC',
+            after,
+            before,
+            orderBy: orderBy === 'DATE_DESC' ? 'RELEASE_BY_RELEASE_ID__DATE_DESC' : 'RELEASE_BY_RELEASE_ID__DATE_ASC',
             exclude: store.state.ui.filter,
         });
 
@@ -180,15 +183,10 @@ function initActorActions(store, _router) {
     }
 
     async function fetchActors({ _commit }, {
-        actorSlug,
         limit = 100,
         letter,
         genders,
     }) {
-        if (actorSlug) {
-            return fetchActorBySlug(actorSlug);
-        }
-
         const { actors } = await graphql(`
             query Actors(
                 $limit: Int,
@@ -260,6 +258,7 @@ function initActorActions(store, _router) {
     }
 
     return {
+        fetchActorBySlug,
         fetchActors,
         fetchActorReleases,
     };

assets/js/get-date-range.js

@@ -0,0 +1,30 @@
+import dayjs from 'dayjs';
+
+const dateRanges = {
+    latest: () => ({
+        after: '1900-01-01',
+        before: dayjs(new Date()).add(1, 'day').format('YYYY-MM-DD'),
+        orderBy: 'DATE_DESC',
+    }),
+    upcoming: () => ({
+        after: dayjs(new Date()).format('YYYY-MM-DD'),
+        before: '2100-01-01',
+        orderBy: 'DATE_ASC',
+    }),
+    new: () => ({
+        after: '1900-01-01',
+        before: '2100-01-01',
+        orderBy: 'CREATED_AT_DESC',
+    }),
+    all: () => ({
+        after: '1900-01-01',
+        before: '2100-01-01',
+        orderBy: 'DATE_DESC',
+    }),
+};
+
+function getDateRange(range) {
+    return dateRanges[range]();
+}
+
+export default getDateRange;

assets/js/releases/actions.js

@@ -1,9 +1,12 @@
 import { graphql } from '../api';
 import { releasesFragment, releaseFragment } from '../fragments';
 import { curateRelease } from '../curate';
+import getDateRange from '../get-date-range';
 
 function initReleasesActions(store, _router) {
-    async function fetchReleases({ _commit }, { limit = 100 }) {
+    async function fetchReleases({ _commit }, { limit = 100, range = 'latest' }) {
+        const { before, after, orderBy } = getDateRange(range);
+
         const { releases } = await graphql(`
             query Releases(
                 $limit:Int = 1000,
@@ -16,9 +19,9 @@ function initReleasesActions(store, _router) {
             }
         `, {
             limit,
-            after: store.getters.after,
-            before: store.getters.before,
-            orderBy: store.getters.orderBy,
+            after,
+            before,
+            orderBy,
             exclude: store.state.ui.filter,
         });
 

assets/js/router.js

@@ -18,10 +18,24 @@ Vue.use(VueRouter);
 const routes = [
     {
         path: '/',
-        redirect: { name: 'home' },
+        redirect: {
+            name: 'home',
+            params: {
+                range: 'latest',
+            },
+        },
     },
     {
         path: '/home',
+        redirect: {
+            name: 'home',
+            params: {
+                range: 'latest',
+            },
+        },
+    },
+    {
+        path: '/:range',
         component: Home,
         name: 'home',
     },
@@ -37,8 +51,19 @@ const routes = [
     },
     {
         path: '/actor/:actorSlug',
-        component: Actor,
         name: 'actor',
+        redirect: from => ({
+            name: 'actorRange',
+            params: {
+                ...from.params,
+                range: 'latest',
+            },
+        }),
+    },
+    {
+        path: '/actor/:actorSlug/:range',
+        component: Actor,
+        name: 'actorRange',
     },
     {
         path: '/site/:siteSlug',

assets/js/ui/actions.js

@@ -6,7 +6,6 @@ function initUiActions(_store, _router) {
 
     function setRange({ commit }, range) {
         commit('setRange', range);
-        localStorage.setItem('range', range);
     }
 
     function setBatch({ commit }, batch) {

assets/js/ui/state.js

@@ -1,12 +1,11 @@
 const storedFilter = localStorage.getItem('filter');
-const storedRange = localStorage.getItem('range');
 const storedBatch = localStorage.getItem('batch');
 const storedSfw = localStorage.getItem('sfw');
 const storedTheme = localStorage.getItem('theme');
 
 export default {
     filter: storedFilter ? storedFilter.split(',') : ['gay', 'transsexual'],
-    range: storedRange || 'latest',
+    range: 'latest',
     batch: storedBatch || 'all',
     sfw: storedSfw === 'true' || false,
     theme: storedTheme || 'light',