Skip to content
This repository has been archived by the owner on Jul 6, 2021. It is now read-only.

Use new og-image service for episode previews #4

Merged
merged 2 commits into from
Jul 5, 2021
Merged

Use new og-image service for episode previews #4

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
47d6a01
use new og-image service for episode previews
rikukissa Jul 4, 2021
7543586
fix markdown formatting
rikukissa Jul 5, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
28 changes: 4 additions & 24 deletions components/Layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Head from "next/head";
import React from "react";
import { episodeTitleWithoutNumber } from "../util/episodes";

interface ILayout {
children: React.ReactNode;
Expand All @@ -18,30 +19,9 @@ export const Layout = ({ children, episode }: ILayout) => {
const url = episode
? `${process.env.NEXT_PUBLIC_SITE_URL}/${episode.number}`
: process.env.NEXT_PUBLIC_SITE_URL;
const coverUrl = `${process.env.NEXT_PUBLIC_SITE_URL}/cover.jpg`;

const metaTags = [
{ name: "title", content: title },
{
name: "keywords",
content:
"webbidevaus, web dev, podcast, react, node, typescript, javascript",
},
{
name: "description",
content: description,
},
{ property: "og:title", content: title },
{ property: "og:description", content: description },
{ property: "og:url", content: url },
{ property: "og:image", content: coverUrl },
{ property: "og:type", content: "website" },
{ property: "twitter:title", content: title },
{ property: "twitter:description", content: description },
{ property: "twitter:url", content: url },
{ property: "twitter:image", content: coverUrl },
{ property: "twitter:card", content: "summary_large_image" },
];
Comment on lines -23 to -44
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Missäs nää nyt on?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nää ei ollu ollenkaa käytössä 😬 oli unused variable

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Käytännössä noi taitaa olla kuitenkin kaikki noissa metatageissa, eli olisko tää peruja jostain vanhasta koodista

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Joo kattelin tuolla netlifypreviewissä mut unohin tulla kommentoimaan takas, että kyl ne jotenkin sinne tosiaan valuu.

const coverUrl = `https://og-webbidevaus.vercel.app/${encodeURIComponent(
`**Jakso ${episode.number}**: ${episodeTitleWithoutNumber(episode.title)}`
)}?theme=${episode.number % 2 === 0 ? "light" : "dark"}&md=1&fontSize=100px`;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tätä saa varmaan just sellaseks teemattua kun haluaa? Mietin että vois ainakin jotain väriä laittaa josain kohtaa.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Lisäks tuo ** ei näytä boldaavan tekstiä vaan tulee ihan sellaisenaan
image

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah pentele, pitää siirtää noi tähdet ton encodeUriComponent-kutsun ulkopuolelle


return (
<>
Expand Down
10 changes: 10 additions & 0 deletions next.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,14 @@
module.exports = {
// serverless for next-on-netlify
target: "serverless",
webpack: (config, { isServer }) => {
rikukissa marked this conversation as resolved.
Show resolved Hide resolved
// Fixes npm packages that depend on `fs` module
if (!isServer) {
config.node = {
fs: "empty",
};
}

return config;
},
};
6 changes: 1 addition & 5 deletions pages/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,9 @@ import { Footer } from "../components/Footer";
import { Meta } from "../components/Meta";
import { Player } from "../components/Player";
import { GetStaticProps } from "next";
import { getEpisodes } from "../util/episodes";
import { episodeTitleWithoutNumber, getEpisodes } from "../util/episodes";
import { ListingEpisode } from "../types/Episode";

function episodeTitleWithoutNumber(title: string) {
return title.replace(/^\d*. /, "");
}

interface IHome {
allEpisodes: ListingEpisode[];
}
Expand Down
6 changes: 5 additions & 1 deletion util/episodes.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Left } from "purify-ts/Either";
import { Maybe } from "purify-ts/Maybe";
import { List } from "purify-ts/List";
import path from "path";
const fs = require("fs").promises;
import { promises as fs } from "fs";
rikukissa marked this conversation as resolved.
Show resolved Hide resolved
import { ListingEpisodes, ListingEpisode, Episode } from "../types/Episode";
import { authFetch, plainFetchAuth } from "../util/fetch";
import { GetType } from "purify-ts";
Expand Down Expand Up @@ -76,3 +76,7 @@ export async function getEpisodes(podcastId?: string) {
.chain((val) => EitherAsync.liftEither(ListingEpisodes.decode(val)))
).orDefault({ collection: [] });
}

export function episodeTitleWithoutNumber(title: string) {
return title.replace(/^\d*. /, "");
}