mirror of
https://github.com/coracle-social/coracle.git
synced 2024-09-30 00:41:12 +00:00
Fix some note rendering bugs, throw error when dufflepud is not configured
This commit is contained in:
parent
c80988882b
commit
c6cdcfb2f8
@ -16,7 +16,6 @@
|
|||||||
isAddress,
|
isAddress,
|
||||||
isNewline,
|
isNewline,
|
||||||
} from "@welshman/content"
|
} from "@welshman/content"
|
||||||
import MediaSet from "src/partials/MediaSet.svelte"
|
|
||||||
import QRCode from "src/partials/QRCode.svelte"
|
import QRCode from "src/partials/QRCode.svelte"
|
||||||
import NoteContentNewline from "src/app/shared/NoteContentNewline.svelte"
|
import NoteContentNewline from "src/app/shared/NoteContentNewline.svelte"
|
||||||
import NoteContentEllipsis from "src/app/shared/NoteContentEllipsis.svelte"
|
import NoteContentEllipsis from "src/app/shared/NoteContentEllipsis.svelte"
|
||||||
@ -44,13 +43,13 @@
|
|||||||
const isBoundary = i => {
|
const isBoundary = i => {
|
||||||
const parsed = shortContent[i]
|
const parsed = shortContent[i]
|
||||||
|
|
||||||
if (!parsed || isBoundary(parsed)) return true
|
if (!parsed || isNewline(parsed)) return true
|
||||||
if (isText(parsed)) return parsed.value.match(/^\s+$/)
|
if (isText(parsed)) return parsed.value.match(/^\s+$/)
|
||||||
|
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
const isStartOrEnd = i => Boolean(isBoundary(i - 1) || isBoundary(i + 1))
|
const isStartOrEnd = i => Boolean(isBoundary(i - 1) && isBoundary(i + 1))
|
||||||
|
|
||||||
const getLinks = content =>
|
const getLinks = content =>
|
||||||
content.filter(x => isLink(x) && x.value.isMedia).map(x => x.value.url.toString())
|
content.filter(x => isLink(x) && x.value.isMedia).map(x => x.value.url.toString())
|
||||||
@ -67,7 +66,6 @@
|
|||||||
)
|
)
|
||||||
|
|
||||||
$: links = getLinks(shortContent)
|
$: links = getLinks(shortContent)
|
||||||
$: extraLinks = without(links, getLinks(fullContent))
|
|
||||||
$: ellipsize = expandable && shortContent.find(isEllipsis)
|
$: ellipsize = expandable && shortContent.find(isEllipsis)
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -107,9 +105,6 @@
|
|||||||
{/if}
|
{/if}
|
||||||
{/each}
|
{/each}
|
||||||
</div>
|
</div>
|
||||||
{#if showMedia && extraLinks.length > 0}
|
|
||||||
<MediaSet links={extraLinks} />
|
|
||||||
{/if}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{#if ellipsize}
|
{#if ellipsize}
|
||||||
|
@ -10,6 +10,8 @@
|
|||||||
|
|
||||||
const url = value.url.toString()
|
const url = value.url.toString()
|
||||||
|
|
||||||
|
const coracleRegexp = /^(https?:\/\/)?(app\.)?coracle.social/
|
||||||
|
|
||||||
const close = () => {
|
const close = () => {
|
||||||
hidden = true
|
hidden = true
|
||||||
}
|
}
|
||||||
@ -17,18 +19,16 @@
|
|||||||
let hidden = false
|
let hidden = false
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#if url.includes('coracle.social/')}
|
{#if url.match(coracleRegexp)}
|
||||||
<Anchor
|
<Anchor
|
||||||
modal
|
modal
|
||||||
stopPropagation
|
stopPropagation
|
||||||
class="overflow-hidden text-ellipsis whitespace-nowrap underline"
|
class="overflow-hidden text-ellipsis whitespace-nowrap underline"
|
||||||
href={url.replace(/(https?:\/\/)?(app\.)?coracle.social/, '')}>
|
href={url.replace(coracleRegexp, '')}>
|
||||||
{displayUrl(url)}
|
{displayUrl(url)}
|
||||||
</Anchor>
|
</Anchor>
|
||||||
{:else if showMedia && value.isMedia && !hidden}
|
{:else if showMedia && !hidden}
|
||||||
<div class="py-2">
|
<Media url={url} onClose={close} />
|
||||||
<Media url={url} onClose={close} />
|
|
||||||
</div>
|
|
||||||
{:else if isShareableRelayUrl(url)}
|
{:else if isShareableRelayUrl(url)}
|
||||||
<Anchor
|
<Anchor
|
||||||
modal
|
modal
|
||||||
|
@ -255,7 +255,15 @@ export const imgproxy = (url: string, {w = 640, h = 1024} = {}) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const dufflepud = (path: string) => `${getSetting("dufflepud_url")}/${path}`
|
export const dufflepud = (path: string) => {
|
||||||
|
const base = getSetting("dufflepud_url")
|
||||||
|
|
||||||
|
if (!base) {
|
||||||
|
throw new Error("Dufflepud is not enabled")
|
||||||
|
}
|
||||||
|
|
||||||
|
return `${base}/${path}`
|
||||||
|
}
|
||||||
|
|
||||||
export const session = new Derived(
|
export const session = new Derived(
|
||||||
[pubkey, sessions],
|
[pubkey, sessions],
|
||||||
@ -1999,16 +2007,19 @@ class IndexedDBAdapter {
|
|||||||
const removedRecords = prev.filter(r => !currentIds.has(r[key]))
|
const removedRecords = prev.filter(r => !currentIds.has(r[key]))
|
||||||
|
|
||||||
if (newRecords.length > 0) {
|
if (newRecords.length > 0) {
|
||||||
|
console.log('putting', name, newRecords.length, current.length)
|
||||||
await storage.bulkPut(name, newRecords)
|
await storage.bulkPut(name, newRecords)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (removedRecords.length > 0) {
|
if (removedRecords.length > 0) {
|
||||||
|
console.log('deleting', name, removedRecords.length, current.length)
|
||||||
await storage.bulkDelete(name, removedRecords.map(prop(key)))
|
await storage.bulkDelete(name, removedRecords.map(prop(key)))
|
||||||
}
|
}
|
||||||
|
|
||||||
// If we have much more than our limit, prune our store. This will get persisted
|
// If we have much more than our limit, prune our store. This will get persisted
|
||||||
// the next time around.
|
// the next time around.
|
||||||
if (current.length > limit * 1.5) {
|
if (current.length > limit * 1.5) {
|
||||||
|
console.log('pruning', name, current.length)
|
||||||
set((sort ? sort(current) : current).slice(0, limit))
|
set((sort ? sort(current) : current).slice(0, limit))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
import Image from "src/partials/Image.svelte"
|
import Image from "src/partials/Image.svelte"
|
||||||
import Anchor from "src/partials/Anchor.svelte"
|
import Anchor from "src/partials/Anchor.svelte"
|
||||||
import Spinner from "src/partials/Spinner.svelte"
|
import Spinner from "src/partials/Spinner.svelte"
|
||||||
import {dufflepud, imgproxy} from "src/engine"
|
import {getSetting, dufflepud, imgproxy} from "src/engine"
|
||||||
|
|
||||||
export let url
|
export let url
|
||||||
export let imeta = Tags.wrap([["url", url]])
|
export let imeta = Tags.wrap([["url", url]])
|
||||||
@ -18,8 +18,8 @@
|
|||||||
const loadPreview = async () => {
|
const loadPreview = async () => {
|
||||||
const json = await Fetch.postJson(dufflepud("link/preview"), {url})
|
const json = await Fetch.postJson(dufflepud("link/preview"), {url})
|
||||||
|
|
||||||
if (!json.title && !json.image) {
|
if (!json?.title && !json?.image) {
|
||||||
throw new Error("Unable to load preview")
|
throw new Error("Failed to load link preview")
|
||||||
}
|
}
|
||||||
|
|
||||||
return json
|
return json
|
||||||
@ -81,7 +81,7 @@
|
|||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
{:catch}
|
{:catch}
|
||||||
<p class="mb-1 px-12 py-24 text-center text-neutral-600">
|
<p class="mb-1 p-12 text-center text-neutral-600">
|
||||||
Unable to load a preview for {url}
|
Unable to load a preview for {url}
|
||||||
</p>
|
</p>
|
||||||
{/await}
|
{/await}
|
||||||
|
@ -1,31 +0,0 @@
|
|||||||
<script lang="ts">
|
|
||||||
import Media from "src/partials/Media.svelte"
|
|
||||||
import Anchor from "src/partials/Anchor.svelte"
|
|
||||||
import Modal from "src/partials/Modal.svelte"
|
|
||||||
|
|
||||||
export let links
|
|
||||||
|
|
||||||
let showModal = false
|
|
||||||
|
|
||||||
const openModal = () => {
|
|
||||||
showModal = true
|
|
||||||
}
|
|
||||||
|
|
||||||
const closeModal = () => {
|
|
||||||
showModal = false
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="my-8 flex justify-center">
|
|
||||||
<Anchor button on:click={openModal}>
|
|
||||||
<i class="fa fa-plus" /> Show all {links.length} link previews
|
|
||||||
</Anchor>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{#if showModal}
|
|
||||||
<Modal onEscape={closeModal}>
|
|
||||||
{#each links as url}
|
|
||||||
<Media {url} />
|
|
||||||
{/each}
|
|
||||||
</Modal>
|
|
||||||
{/if}
|
|
Loading…
Reference in New Issue
Block a user