Add "Reading" shelf to loggedIn home page

This commit is contained in:
Robbie Antenesse 2021-04-21 21:42:26 -06:00
parent 875e6a75c8
commit 1e455720e8
3 changed files with 44 additions and 3 deletions

View File

@ -10,6 +10,7 @@ class HomeController extends ViewController {
recentUpdates: [], recentUpdates: [],
}, },
loggedIn: { loggedIn: {
readingShelfId: null,
updates: [], // statuses, ratings, and reviews from people you follow. updates: [], // statuses, ratings, and reviews from people you follow.
interactions: [], // likes, comments, recommendations, etc. interactions: [], // likes, comments, recommendations, etc.
}, },

View File

@ -1,11 +1,47 @@
const html = require('choo/html'); const html = require('choo/html');
const { ShelvesController } = require('../shelves/controller');
const loggedInView = (homeController, emit) => { const loggedInView = (homeController, emit) => {
const { __ } = homeController.i18n; const { __ } = homeController.i18n;
const shelvesController = new ShelvesController(homeController.appState, homeController.appState.i18n);
const { readingShelfId } = homeController.state;
const readingShelf = readingShelfId && typeof shelvesController.state.loadedShelves[readingShelfId] !== 'undefined'
? shelvesController.state.loadedShelves[readingShelfId]
: null;
console.log(readingShelf);
if (shelvesController.appState.isFrontend && shelvesController.state.myShelves.length <= 0) {
shelvesController.getUserShelves().then(() => {
const readingShelfId = shelvesController.state.myShelves.find(shelf => shelf.name === 'Reading').id;
console.log(readingShelfId);
homeController.state.readingShelfId = readingShelfId + '/';
console.log(homeController.state);
return shelvesController.getShelf(homeController.state.readingShelfId);
}).then(() => {
emit(shelvesController.appState.events.RENDER);
});
}
return [ return [
html`<section> html`<section>
<h2>${__('home.logged_in.subtitle')}</h2> <h2>${__('home.logged_in.subtitle')}</h2>
<div class="card">
<header><h3>Reading</h3></header>
<footer>
${
readingShelf === null
? html`<i class="icon-loading animate-spin"></i>`
: readingShelf.shelfItems.map((shelfItem, shelfItemIndex) => {
return html`<div>
${ shelfItem.title }
</div>`;
})
}
</footer>
</div>
<div class="flex one two-700"> <div class="flex one two-700">
<div> <div>
<div class="card"> <div class="card">

View File

@ -36,11 +36,15 @@ class ShelvesController extends ViewController {
}); });
} }
getShelf (target) {
return fetch('/api/shelf/get/' + target).then(response => response.json()).then(shelf => {
this.state.loadedShelves[target] = shelf;
});
}
getTargetShelf () { getTargetShelf () {
const target = this.targetShelf + '/' + (this.targetDomain !== null ? `${this.targetDomain}` : ''); const target = this.targetShelf + '/' + (this.targetDomain !== null ? `${this.targetDomain}` : '');
return fetch('/api/shelf/get/' + target).then(response => response.json()).then(shelf => { return this.getShelf(target);
this.state.loadedShelves[this.targetShelf] = shelf;
});
} }
} }