Skip to content

Commit

Permalink
lint tsx
Browse files Browse the repository at this point in the history
  • Loading branch information
Timothée Rebours committed Mar 5, 2024
1 parent 7de7d19 commit faa775c
Show file tree
Hide file tree
Showing 3 changed files with 15 additions and 15 deletions.
4 changes: 2 additions & 2 deletions .eslintrc.cjs
Original file line number Diff line number Diff line change
Expand Up @@ -47,15 +47,15 @@ module.exports = {
}
},
{
files: ['*.ts'],
files: ['*.ts', '*.tsx'],
extends: 'standard-with-typescript',
env: {
es2020: true,
node: true
}
},
{
files: ['*.mjs', '*.cjs', '*.js'],
files: ['*.mjs', '*.cjs', '*.js', '*.jsx'],
extends: 'standard',
env: {
es2020: true,
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"version": "0.0.1",
"scripts": {
"prelint": "rm -rf dist .astro && astro sync",
"lint": "eslint . --ext .js,.ts,.cjs,.mjs,.astro && astro check",
"lint": "eslint . --ext .js,.ts,.cjs,.mjs,.astro,.jsx,.tsx && astro check",
"prestart": "node encryptAssets.js && DUMMY=true node encryptAssets.js",
"dev": "astro dev",
"start": "astro dev",
Expand Down
24 changes: 12 additions & 12 deletions src/components/og-image.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import {Buffer} from 'node:buffer'
import { Buffer } from 'node:buffer'
import sharp from 'sharp'
import { findLargestUsableFontSize } from '@altano/satori-fit-text'
import roboto400Normal from '@fontsource/roboto/files/roboto-latin-400-normal.woff?arraybuffer'
Expand All @@ -19,11 +19,11 @@ export default waterfall(async ({ image, title, description, author, date, width
.toBuffer()

const b64ImageSrc = `data:image/png;base64,${resizedImage.toString('base64')}`
const dateString = date ?
dateFormat === 'en' ?
`${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getDate().toString().padStart(2, '0')}/${date.getFullYear().toString().padStart(4, '0')}` :
`${date.getDate().toString().padStart(2, '0')}/${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getFullYear().toString().padStart(4, '0')}` :
undefined
const dateString = date != null
? dateFormat === 'en'
? `${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getDate().toString().padStart(2, '0')}/${date.getFullYear().toString().padStart(4, '0')}`
: `${date.getDate().toString().padStart(2, '0')}/${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getFullYear().toString().padStart(4, '0')}`
: undefined

const frameWidth = 48
const imageMargin = 20
Expand All @@ -38,7 +38,7 @@ export default waterfall(async ({ image, title, description, author, date, width
text: title,
minFontSize: 65,
maxWidth: contentWidth,
maxHeight: titleMaxHeight,
maxHeight: titleMaxHeight
})

const descriptionFontSize = await findLargestUsableFontSize({
Expand All @@ -47,17 +47,17 @@ export default waterfall(async ({ image, title, description, author, date, width
text: description,
maxFontSize: 50,
maxWidth: contentWidth,
maxHeight: height - 2 * frameWidth - 30 - titleMaxHeight - imageMargin - /* space between author line and description */ 3 * imageMargin,
maxHeight: height - 2 * frameWidth - 30 - titleMaxHeight - imageMargin - /* space between author line and description */ 3 * imageMargin
})

return <div style={{ display: 'flex', padding: frameWidth, width, height}}>
<div style={{ display: 'flex', maxWidth: '100%', maxHeight: '100%', flexDirection: 'column', backgroundColor: 'white', justifyContent: 'center', borderRadius: 16, paddingRight: imageMargin, boxShadow: '0 25px 50px -12px rgb(0 0 0 / 0.25)', width, height}}>
return <div style={{ display: 'flex', padding: frameWidth, width, height }}>
<div style={{ display: 'flex', maxWidth: '100%', maxHeight: '100%', flexDirection: 'column', backgroundColor: 'white', justifyContent: 'center', borderRadius: 16, paddingRight: imageMargin, boxShadow: '0 25px 50px -12px rgb(0 0 0 / 0.25)', width, height }}>
<div style={{ display: 'flex', maxWidth: '100%', maxHeight: '100%', width: width - 2 * frameWidth, height: height - 2 * frameWidth }}>
<img style={{ margin: imageMargin }} src={b64ImageSrc} width={Math.floor(width / 3)}/>
<div style={{ display: 'flex', flexDirection: 'column', width: contentWidth, height: height - 2 * frameWidth }}>
<h1 style={{ display: 'block', position: 'absolute', left: 0, top: 0, fontSize: titleFontSize, fontWeight: 700, maxWidth: contentWidth, lineClamp: 2, lineHeight: 1.3 }}>{title}</h1>
<span style={{ display: 'block', position: 'absolute', left: 0, top: titleMaxHeight + imageMargin, fontSize: descriptionFontSize, fontWeight: 400, maxWidth: contentWidth, lineClamp: 3, lineHeight: 1.3}}>{description}</span>
{author != null ? <span style={{ position: 'absolute', bottom: 0, left: 0, fontSize: 30, marginBottom: imageMargin}}>{author}</span> : <></>}
<span style={{ display: 'block', position: 'absolute', left: 0, top: titleMaxHeight + imageMargin, fontSize: descriptionFontSize, fontWeight: 400, maxWidth: contentWidth, lineClamp: 3, lineHeight: 1.3 }}>{description}</span>
{author != null ? <span style={{ position: 'absolute', bottom: 0, left: 0, fontSize: 30, marginBottom: imageMargin }}>{author}</span> : <></>}
{dateString != null ? <span style={{ position: 'absolute', bottom: imageMargin, right: 0, fontSize: 30 }}>{dateString}</span> : <></>}
</div>
</div>
Expand Down

0 comments on commit faa775c

Please sign in to comment.