Twitter card and metadata

This commit is contained in:
Hayk Martiros 2022-12-14 23:24:18 -08:00
parent 2400798d6b
commit 5059c277d7
2 changed files with 36 additions and 2 deletions

View File

@ -4,10 +4,29 @@ export default function PageHead() {
return ( return (
<Head> <Head>
<title>Riffusion</title> <title>Riffusion</title>
<meta property="og:site_name" content="Riffusion" />
<meta
property="og:title"
content="Riffusion - Stable diffusion for real-time music generation"
/>
<meta
property="article:author"
content="Seth Forsgren and Hayk Martiros"
/>
<meta <meta
name="description" name="description"
content="My name is Riffusion, and I write music." content="Stable diffusion for real-time music generation"
/> />
<meta
name="og:description"
content="Stable diffusion for real-time music generation"
/>
<meta property="og:url" content="http://www.riffusion." />
<meta property="og:locale" content="en_US" />
<meta property="og:website" content="http://wwww.riffusion" />
<meta name="twitter:image" content="/public/pop_sample.jpg" />
<meta property="og:image" content="/public/pop_sample.jpg" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
</Head> </Head>
); );

View File

@ -174,6 +174,21 @@ export default function Share({
return `https://www.reddit.com/r/riffusion/submit?title=Prompt:+${encodedPrompt}&url=${encodedUrl}`; return `https://www.reddit.com/r/riffusion/submit?title=Prompt:+${encodedPrompt}&url=${encodedUrl}`;
}, [nowPlayingResult, inferenceResults]); }, [nowPlayingResult, inferenceResults]);
const getTwitterLink = useCallback(() => {
if (inferenceResults.length == 0) {
return null;
}
const result = nowPlayingResult ? nowPlayingResult : inferenceResults[0];
const encodedPrompt = encodeURIComponent(result.input.start.prompt);
const encodedUrl = encodeURIComponent(generateLink(0));
return `https://twitter.com/intent/tweet?&text=Check+out+this+prompt+on+%23riffusion:+${encodeURI(
'"'
)}${encodedPrompt}${encodeURI('"')}${encodeURI("\n\n")}${encodedUrl}`;
}, [nowPlayingResult, inferenceResults]);
return ( return (
<> <>
<button <button
@ -230,7 +245,7 @@ export default function Share({
<GrTwitter <GrTwitter
className="ml-4 w-8 h-8 mb-1 text-[#1DA1F2]" className="ml-4 w-8 h-8 mb-1 text-[#1DA1F2]"
onClick={() => { onClick={() => {
console.log("click"); window.open(getTwitterLink(), "_blank");
}} }}
/> />
<GrReddit <GrReddit