Dynamic meta tags for content #2546
No reviewers
Labels
No labels
accessibility
app-parity
area: creator
area: daemon
area: design
area: devops
area: discovery
area: docs
area: installer
area: internal
area: livestream
area: performance
area: proposal
area: reposts
area: rewards
area: search
area: security
area: subscriptions
area: sync
area: ux
area: viewer
area: wallet
BEAMER
channel
comments
community PR
consider soon
core team
css
dependencies
electron
Epic
feature request
first-timers-only
good first issue
hacktoberfest
help wanted
hub-dependent
icebox
Invalid
level: 0
level: 1
level: 2
level: 3
level: 4
merge when green
needs: exploration
needs: grooming
needs: priority
needs: repro
needs: tech design
notifications
odysee
on hold
playlists
priority: blocker
priority: high
priority: low
priority: medium
protocol dependent
recsys
redesign
regression
resilience
sdk dependent
Tom's Wishlist
trending
type: bug
type: discussion
type: improvement
type: new feature
type: refactor
type: task
type: testing
unplanned
windows
No milestone
No project
No assignees
1 participant
Notifications
Due date
No due date set.
Dependencies
No dependencies set.
Reference: LBRYCommunity/lbry-desktop#2546
Loading…
Reference in a new issue
No description provided.
Delete branch "2410-meta-tags"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
PR Checklist
Please check all that apply to this PR using "x":
PR Type
What kind of change does this PR introduce?
Fixes
Issue Number: #2410
What is the current behavior?
Shared
lbry.tv
links are plain.What is the new behavior?
Shared
lbry.tv
links are enriched with metadata to make them more appealing to scrollers.Included in this PR is commented code for tag inclusion, whenever that drops. Also, when navigating away from content to a regular page, the
title
attribute doesn't update (yet). It should default toLBRY.tv
or something similar.We don't really expose author even though it's available - it should use channel if there is one (could be anonymous too)
Does this work? I figured we would need to change code in
platforms/web/server.js
since we aren't server rending our app.Idk how to test on the web but it updates in the app.
To test the basic og image I used ngrok. I would run the web version with
yarn run:web
(notyarn dev:web
, that didn't seem to work right since it was a webpack-dev-server).Then point ngrok at
localhost:1337
and it gives you a regular url that points to your computer. Then sharing that url will show the og tags.It doesn't appear to work.
You can just use your computer's name and send an iMessage to yourself to test. (
http://computer.local:1337/path/to/content
)I don't see how making edits to
platforms/web/server.js
will work. Navigating the app doesn't trigger updates there. Hard refreshes trigger updates but obviously that doesn't happen naturally.Finally, useful information isn't found here aside from the path.
Is it possible to have the video URL part of the claim data? There's no way to have a video preview if I don't have the direct mp4 link.
Let's stick to thumbnail previews for now, that would have to be tackled another day.
We don't know what streaming solution LBRY.tv will go with yet, but it should be possible to make some url later on that will point to the video itself.
Per our discussion today, might be better to grab this data via a chainquery fetch. We'll have to do this based on if we know the claim id or not. This should also work for channels, CQ uses the same field for thumbnail url (source url for banner if we wanted that).
Here's an example by claim id:
https://chainquery.lbry.io/api/sql?query=SELECT%20*%20FROM%20claim%20where%20claim_id=%2294a844e1f9e7dab814378de404e35ec69b57435b%22
just claim name:
https://chainquery.lbry.io/api/sql?query=SELECT%20*%20FROM%20claim%20where%20name=%22@theGavin2000%22&bid_state=%22controlling%22
thumbnail misspelled :)
Query with a channel: SELECT channel.name as channel, claim.name, claim.description, claim.language, claim.thumbnail_url, claim.title FROM claim left join claim channel on claim.publisher_id = channel.claim_id where claim.claim_id="93a61971c473ade02300361dc077eb564b558a8d"
Will we always have the claim id? does that come from the claim that's resolved? What if someone shares beta.lbry.tv/jiggytom Sounds like we'll need to use claim.name = xxx and bid_state = controlling per my original suggestion in that case.
I saw we grab claim id from the URL, so we'll need to adjust the query as such.
Is this code writing the HTML to disk only to read it back? If I'm understanding what this does correctly, it seems like it could be skipped entirely.
(Additionally, this approach could cause a race condition among two requests that came in simultaneously)
Can these values be injected into the HTML file rather than built in JS?
How about a fallback of "Watch %content_title% on lbry.tv" or "Watch %content_title% from %creator% on lbry.tv"?
@ -10,0 +14,4 @@
let isAppPage = req.url.includes('/$/');
let isChannel = req.url.includes('/@');
let queryUrl = '';
This test probably needs to be stronger, as I think
@
can technically appear in the middle of a claim name@ -10,0 +22,4 @@
case isChannel:
queryUrl = `https://chainquery.lbry.io/api/sql?query=SELECT channel.name as channel, claim.name, claim.description, claim.language, claim.thumbnail_url, claim.title FROM claim left join claim channel on claim.publisher_id = channel.claim_id where claim.claim_id="${identifier}"`;
break;
@sayplastic (or @nikooo777?) is there a better way for @NetOperatorWibby to be getting data from chainquery for lbry.tv than this?
@ -10,0 +14,4 @@
let isAppPage = req.url.includes('/$/');
let isChannel = req.url.includes('/@');
let queryUrl = '';
@ is a reversed character.
@ -10,0 +22,4 @@
case isChannel:
queryUrl = `https://chainquery.lbry.io/api/sql?query=SELECT channel.name as channel, claim.name, claim.description, claim.language, claim.thumbnail_url, claim.title FROM claim left join claim channel on claim.publisher_id = channel.claim_id where claim.claim_id="${identifier}"`;
break;
if this is serverside we can use a mysql connector, otherwise no, unless we proxy the calls.
Also this risks getting throttled by chainquery, I think there is a limit to how many queries can be sent to the web API
@ -10,0 +22,4 @@
case isChannel:
queryUrl = `https://chainquery.lbry.io/api/sql?query=SELECT channel.name as channel, claim.name, claim.description, claim.language, claim.thumbnail_url, claim.title FROM claim left join claim channel on claim.publisher_id = channel.claim_id where claim.claim_id="${identifier}"`;
break;
How do I improve this?
@ -10,0 +22,4 @@
case isChannel:
queryUrl = `https://chainquery.lbry.io/api/sql?query=SELECT channel.name as channel, claim.name, claim.description, claim.language, claim.thumbnail_url, claim.title FROM claim left join claim channel on claim.publisher_id = channel.claim_id where claim.claim_id="${identifier}"`;
break;
as first version we agreed that this is fine. however please update from .io to .com
@NetOperatorWibby / @seanyesmunt can this be merged?
@kauffj wanted to test or make changes to this once lbry.tv was running the new app
Cool, I can try pushing this up on beta / dev later today.
This works and is mergeable as long as @sayplastic and/or @nikooo777 says it won't bring down and/or harm lbry.tv or chainquery.
I filed https://github.com/lbryio/lbrytv/issues/48 to find the proper solution.