fixed boosts not displaying properly; among
This commit is contained in:
parent
5db825d97e
commit
f2c96d5968
|
@ -256,7 +256,7 @@ export async function parsePost(data, ancestor_count, with_context) {
|
||||||
post.reply_count = data.replies_count;
|
post.reply_count = data.replies_count;
|
||||||
post.favourite_count = data.favourites_count;
|
post.favourite_count = data.favourites_count;
|
||||||
post.favourited = data.favourited;
|
post.favourited = data.favourited;
|
||||||
post.boosted = data.boosted;
|
post.boosted = data.reblogged;
|
||||||
post.mentions = data.mentions;
|
post.mentions = data.mentions;
|
||||||
post.files = data.media_attachments;
|
post.files = data.media_attachments;
|
||||||
post.url = data.url;
|
post.url = data.url;
|
||||||
|
@ -302,7 +302,7 @@ export async function parseUser(data) {
|
||||||
if (data.acct.includes('@'))
|
if (data.acct.includes('@'))
|
||||||
user.host = data.acct.split('@')[1];
|
user.host = data.acct.split('@')[1];
|
||||||
else
|
else
|
||||||
user.host = get(Client.get()).instance.host;
|
user.host = client.instance.host;
|
||||||
|
|
||||||
user.emojis = [];
|
user.emojis = [];
|
||||||
data.emojis.forEach(emoji_data => {
|
data.emojis.forEach(emoji_data => {
|
||||||
|
@ -312,7 +312,7 @@ export async function parseUser(data) {
|
||||||
user.emojis.push(parseEmoji(emoji_data));
|
user.emojis.push(parseEmoji(emoji_data));
|
||||||
});
|
});
|
||||||
|
|
||||||
get(Client.get()).putCacheUser(user);
|
client.putCacheUser(user);
|
||||||
return user;
|
return user;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -23,10 +23,9 @@ export class Client {
|
||||||
}
|
}
|
||||||
|
|
||||||
static get() {
|
static get() {
|
||||||
if (get(client)) return client;
|
let current = get(client);
|
||||||
|
if (current && current.app) return client;
|
||||||
let new_client = new Client();
|
let new_client = new Client();
|
||||||
if (typeof window !== typeof undefined)
|
|
||||||
window.peekie = new_client;
|
|
||||||
new_client.load();
|
new_client.load();
|
||||||
client.set(new_client);
|
client.set(new_client);
|
||||||
return client;
|
return client;
|
||||||
|
@ -86,13 +85,20 @@ export class Client {
|
||||||
}
|
}
|
||||||
|
|
||||||
async verifyCredentials() {
|
async verifyCredentials() {
|
||||||
|
if (this.user) return this.user;
|
||||||
|
if (!this.app || !this.app.token) {
|
||||||
|
this.user = false;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
const data = await api.verifyCredentials();
|
const data = await api.verifyCredentials();
|
||||||
if (!data) {
|
if (!data) {
|
||||||
this.user = false;
|
this.user = false;
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
this.user = await api.parseUser(data);
|
await client.update(async c => {
|
||||||
client.set(this);
|
c.user = await api.parseUser(data);
|
||||||
|
console.log(`Logged in as @${c.user.username}@${c.user.host}`);
|
||||||
|
});
|
||||||
return this.user;
|
return this.user;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -4,13 +4,14 @@ import { parsePost } from '$lib/client/api.js';
|
||||||
|
|
||||||
export let posts = writable([]);
|
export let posts = writable([]);
|
||||||
|
|
||||||
let client = get(Client.get());
|
|
||||||
let loading = false;
|
let loading = false;
|
||||||
|
|
||||||
export async function getTimeline(clean) {
|
export async function getTimeline(clean) {
|
||||||
if (loading) return; // no spamming!!
|
if (loading) return; // no spamming!!
|
||||||
loading = true;
|
loading = true;
|
||||||
|
|
||||||
|
let client = get(Client.get());
|
||||||
|
|
||||||
let timeline_data;
|
let timeline_data;
|
||||||
if (clean || get(posts).length === 0) timeline_data = await client.getTimeline()
|
if (clean || get(posts).length === 0) timeline_data = await client.getTimeline()
|
||||||
else timeline_data = await client.getTimeline(get(posts)[get(posts).length - 1].id);
|
else timeline_data = await client.getTimeline(get(posts)[get(posts).length - 1].id);
|
||||||
|
|
|
@ -7,6 +7,7 @@
|
||||||
import { play_sound } from '$lib/sound.js';
|
import { play_sound } from '$lib/sound.js';
|
||||||
import { getTimeline } from '$lib/timeline.js';
|
import { getTimeline } from '$lib/timeline.js';
|
||||||
import { goto } from '$app/navigation';
|
import { goto } from '$app/navigation';
|
||||||
|
import { get } from 'svelte/store';
|
||||||
|
|
||||||
const VERSION = APP_VERSION;
|
const VERSION = APP_VERSION;
|
||||||
|
|
||||||
|
@ -30,11 +31,10 @@
|
||||||
goto("/");
|
goto("/");
|
||||||
}
|
}
|
||||||
|
|
||||||
function log_out() {
|
async function log_out() {
|
||||||
if (!confirm("This will log you out. Are you sure?")) return;
|
if (!confirm("This will log you out. Are you sure?")) return;
|
||||||
client.logout().then(() => {
|
await get(Client.get()).logout();
|
||||||
location = "/";
|
goto("/");
|
||||||
});
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -51,7 +51,7 @@
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<div id="nav-items">
|
<div id="nav-items">
|
||||||
<Button label="Timeline" on:click={() => goTimeline()} active>🖼️ Timeline</Button>
|
<Button label="Timeline" on:click={() => goTimeline()} active={client.user}>🖼️ Timeline</Button>
|
||||||
<Button label="Notifications" disabled>
|
<Button label="Notifications" disabled>
|
||||||
🔔 Notifications
|
🔔 Notifications
|
||||||
{#if notification_count}
|
{#if notification_count}
|
||||||
|
|
|
@ -42,8 +42,8 @@
|
||||||
console.error(`Failed to boost post ${post.id}`);
|
console.error(`Failed to boost post ${post.id}`);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
post.boosted = data.boosted;
|
post.boosted = data.reblog ? data.reblog.reblogged : data.boosted;
|
||||||
post.boost_count = data.reblogs_count;
|
post.boost_count = data.reblog ? data.reblog.reblogs_count : data.reblogs_count;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function toggleFavourite() {
|
async function toggleFavourite() {
|
||||||
|
@ -88,8 +88,6 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
let aria_label = post.user.username + '; ' + post.text + '; ' + post.created_at;
|
let aria_label = post.user.username + '; ' + post.text + '; ' + post.created_at;
|
||||||
|
|
||||||
if (post.reply && post.reply.id === undefined) console.log(post);
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="post-container">
|
<div class="post-container">
|
||||||
|
@ -128,8 +126,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="post-actions" aria-label="Post actions" on:click|stopPropagation on:keydown|stopPropagation>
|
<div class="post-actions" aria-label="Post actions" on:click|stopPropagation on:keydown|stopPropagation>
|
||||||
<ActionButton type="reply" label="Reply" bind:count={post.reply_count} sound="post" disabled>🗨️</ActionButton>
|
<ActionButton type="reply" label="Reply" bind:count={post.reply_count} sound="post" disabled>🗨️</ActionButton>
|
||||||
<ActionButton type="boost" label="Boost" on:click={() => toggleBoost()} bind:active={post.boosted} bind:count={post.boost_count} sound="boost">🔁</ActionButton>
|
<ActionButton type="boost" label="Boost" on:click={toggleBoost} bind:active={post.boosted} bind:count={post.boost_count} sound="boost">🔁</ActionButton>
|
||||||
<ActionButton type="favourite" label="Favourite" on:click={() => toggleFavourite()} bind:active={post.favourited} bind:count={post.favourite_count}>⭐</ActionButton>
|
<ActionButton type="favourite" label="Favourite" on:click={toggleFavourite} bind:active={post.favourited} bind:count={post.favourite_count}>⭐</ActionButton>
|
||||||
<ActionButton type="react" label="React" disabled>😃</ActionButton>
|
<ActionButton type="react" label="React" disabled>😃</ActionButton>
|
||||||
<ActionButton type="quote" label="Quote" disabled>🗣️</ActionButton>
|
<ActionButton type="quote" label="Quote" disabled>🗣️</ActionButton>
|
||||||
<ActionButton type="more" label="More" disabled>🛠️</ActionButton>
|
<ActionButton type="more" label="More" disabled>🛠️</ActionButton>
|
||||||
|
|
|
@ -108,8 +108,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="post-actions" aria-label="Post actions" on:click|stopPropagation on:keydown|stopPropagation>
|
<div class="post-actions" aria-label="Post actions" on:click|stopPropagation on:keydown|stopPropagation>
|
||||||
<ActionButton type="reply" label="Reply" bind:count={post.reply_count} sound="post" disabled>🗨️</ActionButton>
|
<ActionButton type="reply" label="Reply" bind:count={post.reply_count} sound="post" disabled>🗨️</ActionButton>
|
||||||
<ActionButton type="boost" label="Boost" on:click={() => toggleBoost()} bind:active={post.boosted} bind:count={post.boost_count} sound="boost">🔁</ActionButton>
|
<ActionButton type="boost" label="Boost" on:click={toggleBoost} bind:active={post.boosted} bind:count={post.boost_count} sound="boost">🔁</ActionButton>
|
||||||
<ActionButton type="favourite" label="Favourite" on:click={() => toggleFavourite()} bind:active={post.favourited} bind:count={post.favourite_count}>⭐</ActionButton>
|
<ActionButton type="favourite" label="Favourite" on:click={toggleFavourite} bind:active={post.favourited} bind:count={post.favourite_count}>⭐</ActionButton>
|
||||||
<ActionButton type="react" label="React" disabled>😃</ActionButton>
|
<ActionButton type="react" label="React" disabled>😃</ActionButton>
|
||||||
<ActionButton type="quote" label="Quote" disabled>🗣️</ActionButton>
|
<ActionButton type="quote" label="Quote" disabled>🗣️</ActionButton>
|
||||||
<ActionButton type="more" label="More" disabled>🛠️</ActionButton>
|
<ActionButton type="more" label="More" disabled>🛠️</ActionButton>
|
||||||
|
|
|
@ -1,2 +1,15 @@
|
||||||
|
import Feed from '$lib/ui/Feed.svelte';
|
||||||
|
import { Client } from '$lib/client/client.js';
|
||||||
|
import Button from '$lib/ui/Button.svelte';
|
||||||
|
import { get } from 'svelte/store';
|
||||||
|
|
||||||
export const prerender = true;
|
export const prerender = true;
|
||||||
export const ssr = false;
|
export const ssr = false;
|
||||||
|
|
||||||
|
export async function load() {
|
||||||
|
let client = get(Client.get());
|
||||||
|
await client.verifyCredentials();
|
||||||
|
return {
|
||||||
|
client: client
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
|
@ -1,28 +1,19 @@
|
||||||
<script>
|
<script>
|
||||||
|
import LogoLight from '$lib/../img/spacesocial-logo-light.svg';
|
||||||
|
import LogoDark from '$lib/../img/spacesocial-logo-dark.svg';
|
||||||
import Feed from '$lib/ui/Feed.svelte';
|
import Feed from '$lib/ui/Feed.svelte';
|
||||||
import { Client } from '$lib/client/client.js';
|
import { Client } from '$lib/client/client.js';
|
||||||
|
import User from '$lib/user/user.js';
|
||||||
import Button from '$lib/ui/Button.svelte';
|
import Button from '$lib/ui/Button.svelte';
|
||||||
import { get } from 'svelte/store';
|
import { get } from 'svelte/store';
|
||||||
|
|
||||||
let client = get(Client.get());
|
export let data;
|
||||||
let logged_in;
|
|
||||||
|
let client = data.client;
|
||||||
|
let logged_in = client.user && client.user.constructor === User;
|
||||||
let instance_url_error = false;
|
let instance_url_error = false;
|
||||||
let logging_in = false;
|
let logging_in = false;
|
||||||
|
|
||||||
if (client.app && client.app.token) {
|
|
||||||
// this triggers the client actually getting the authenticated user's data.
|
|
||||||
client.verifyCredentials().then(user => {
|
|
||||||
if (user) {
|
|
||||||
console.log(`Logged in as @${user.username}@${user.host}`);
|
|
||||||
logged_in = true;
|
|
||||||
} else {
|
|
||||||
logged_in = false;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
logged_in = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
function log_in(event) {
|
function log_in(event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
instance_url_error = false;
|
instance_url_error = false;
|
||||||
|
@ -49,11 +40,18 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#if logged_in === undefined}
|
{#if logged_in}
|
||||||
<div class="loading throb">
|
<header>
|
||||||
<span>just a moment...</span>
|
<h1>Home</h1>
|
||||||
</div>
|
<nav>
|
||||||
{:else if logged_in === false}
|
<Button centered active>Home</Button>
|
||||||
|
<Button centered disabled>Local</Button>
|
||||||
|
<Button centered disabled>Federated</Button>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<Feed />
|
||||||
|
{:else}
|
||||||
<form on:submit={log_in} id="login-form">
|
<form on:submit={log_in} id="login-form">
|
||||||
<img class="app-icon light-only" src={LogoLight} width="320px" aria-label="Space Social"/>
|
<img class="app-icon light-only" src={LogoLight} width="320px" aria-label="Space Social"/>
|
||||||
<img class="app-icon dark-only" src={LogoDark} width="320px" aria-label="Space Social"/>
|
<img class="app-icon dark-only" src={LogoDark} width="320px" aria-label="Space Social"/>
|
||||||
|
@ -77,17 +75,6 @@
|
||||||
|
|
||||||
<p class="form-footer">made with ❤️ by <a href="https://arimelody.me">ari melody</a>, 2024</p>
|
<p class="form-footer">made with ❤️ by <a href="https://arimelody.me">ari melody</a>, 2024</p>
|
||||||
</form>
|
</form>
|
||||||
{:else}
|
|
||||||
<header>
|
|
||||||
<h1>Home</h1>
|
|
||||||
<nav>
|
|
||||||
<Button centered active>Home</Button>
|
|
||||||
<Button centered disabled>Local</Button>
|
|
||||||
<Button centered disabled>Federated</Button>
|
|
||||||
</nav>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<Feed />
|
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
|
@ -1 +0,0 @@
|
||||||
<slot/>
|
|
|
@ -11,7 +11,7 @@ export async function load({ params, url }) {
|
||||||
if (auth_code) {
|
if (auth_code) {
|
||||||
client.getToken(auth_code).then(() => {
|
client.getToken(auth_code).then(() => {
|
||||||
client.save();
|
client.save();
|
||||||
goto(url.origin);
|
goto("/");
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
error(400, {
|
error(400, {
|
||||||
|
|
|
@ -3,19 +3,11 @@ import { Client } from '$lib/client/client.js';
|
||||||
import { parsePost } from '$lib/client/api.js';
|
import { parsePost } from '$lib/client/api.js';
|
||||||
import { get } from 'svelte/store';
|
import { get } from 'svelte/store';
|
||||||
|
|
||||||
|
export const ssr = false;
|
||||||
|
|
||||||
export async function load({ params }) {
|
export async function load({ params }) {
|
||||||
let client = get(Client.get());
|
let client = get(Client.get());
|
||||||
if (client.app && client.app.token) {
|
await client.verifyCredentials();
|
||||||
// this triggers the client actually getting the authenticated user's data.
|
|
||||||
const res = await client.verifyCredentials()
|
|
||||||
if (res) {
|
|
||||||
console.log(`Logged in as @${client.user.username}@${client.user.host}`);
|
|
||||||
} else {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
|
|
||||||
const post_id = params.id;
|
const post_id = params.id;
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue