Display status count

main
Štěpán Škorpil 2022-01-08 22:44:59 +01:00
rodzic 47e1da3bbe
commit 4d0b079380
4 zmienionych plików z 28 dodań i 9 usunięć

Wyświetl plik

@ -9,6 +9,7 @@ import LastPostAtBadge from './badges/LastPostAtBadge'
import BotBadge from './badges/BotBadge'
import { FeedResponseField, FeedResponseItem } from '../types/FeedResponse'
import ParentFeed from './ParentFeed'
import StatusesCountBadge from './badges/StatusesCountBadge'
const Result:React.FC<{ feed:FeedResponseItem }> = ({ feed }) => {
const fallbackEmojiImage = '/emoji.svg'
@ -43,6 +44,7 @@ const Result:React.FC<{ feed:FeedResponseItem }> = ({ feed }) => {
<SoftwareBadge softwareName={feed.node.softwareName}/>
<FeedTypeBadge type={feed.type}/>
<SubscriptionsBadge followingCount={feed.followingCount} followersCount={feed.followersCount}/>
<StatusesCountBadge statusesCount={feed.statusesCount}/>
<CreatedAtBadge createdAt={feed.createdAt}/>
<LastPostAtBadge lastStatusAt={feed.lastStatusAt}/>
<BotBadge bot={feed.bot}/>

Wyświetl plik

@ -3,11 +3,11 @@ import React from 'react'
const CreatedAtBadge:React.FC<{ createdAt: string | null }> = ({ createdAt }) => {
return (
<div className={'badge created-at'} title={'Created at'}>
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="star-of-life"
className="svg-inline--fa fa-star-of-life fa-w-15" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 480 512">
<svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="calendar-plus"
className="svg-inline--fa fa-calendar-plus fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 448 512">
<path fill="currentColor"
d="M471.99 334.43L336.06 256l135.93-78.43c7.66-4.42 10.28-14.2 5.86-21.86l-32.02-55.43c-4.42-7.65-14.21-10.28-21.87-5.86l-135.93 78.43V16c0-8.84-7.17-16-16.01-16h-64.04c-8.84 0-16.01 7.16-16.01 16v156.86L56.04 94.43c-7.66-4.42-17.45-1.79-21.87 5.86L2.15 155.71c-4.42 7.65-1.8 17.44 5.86 21.86L143.94 256 8.01 334.43c-7.66 4.42-10.28 14.21-5.86 21.86l32.02 55.43c4.42 7.65 14.21 10.27 21.87 5.86l135.93-78.43V496c0 8.84 7.17 16 16.01 16h64.04c8.84 0 16.01-7.16 16.01-16V339.14l135.93 78.43c7.66 4.42 17.45 1.8 21.87-5.86l32.02-55.43c4.42-7.65 1.8-17.43-5.86-21.85z"/>
d="M336 292v24c0 6.6-5.4 12-12 12h-76v76c0 6.6-5.4 12-12 12h-24c-6.6 0-12-5.4-12-12v-76h-76c-6.6 0-12-5.4-12-12v-24c0-6.6 5.4-12 12-12h76v-76c0-6.6 5.4-12 12-12h24c6.6 0 12 5.4 12 12v76h76c6.6 0 12 5.4 12 12zm112-180v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V112c0-26.5 21.5-48 48-48h48V12c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v52h128V12c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v52h48c26.5 0 48 21.5 48 48zm-48 346V160H48v298c0 3.3 2.7 6 6 6h340c3.3 0 6-2.7 6-6z"/>
</svg>
<span className={'label'}>Created at</span>
<span className={'value'}>{createdAt !== null ? (new Date(createdAt)).toLocaleDateString() : '?'}</span>

Wyświetl plik

@ -3,12 +3,11 @@ import React from 'react'
const LastPostAtBadge:React.FC<{ lastStatusAt: string | null }> = ({ lastStatusAt }) => {
return (
<div className={'badge last-status-at'} title={'Last status at'}>
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="comment-alt"
className="svg-inline--fa fa-comment-alt fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512">
<svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="calendar-check"
className="svg-inline--fa fa-calendar-check fa-w-14" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 448 512">
<path fill="currentColor"
d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"/>
d="M400 64h-48V12c0-6.627-5.373-12-12-12h-40c-6.627 0-12 5.373-12 12v52H160V12c0-6.627-5.373-12-12-12h-40c-6.627 0-12 5.373-12 12v52H48C21.49 64 0 85.49 0 112v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm-6 400H54a6 6 0 0 1-6-6V160h352v298a6 6 0 0 1-6 6zm-52.849-200.65L198.842 404.519c-4.705 4.667-12.303 4.637-16.971-.068l-75.091-75.699c-4.667-4.705-4.637-12.303.068-16.971l22.719-22.536c4.705-4.667 12.303-4.637 16.97.069l44.104 44.461 111.072-110.181c4.705-4.667 12.303-4.637 16.971.068l22.536 22.718c4.667 4.705 4.636 12.303-.069 16.97z"/>
</svg>
<span className={'label'}>Last status at</span>
<span className={'value'}>{lastStatusAt !== null ? (new Date(lastStatusAt)).toLocaleDateString() : '?'}</span>

Wyświetl plik

@ -0,0 +1,18 @@
import React from 'react'
const StatusesCountBadge:React.FC<{ statusesCount: number | null }> = ({ statusesCount }) => {
return (
<div className={'badge last-status-at'} title={'Status count'}>
<svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="comment-alt"
className="svg-inline--fa fa-comment-alt fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 512 512">
<path fill="currentColor"
d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"/>
</svg>
<span className={'label'}>Status count</span>
<span className={'value'}>{statusesCount !== null ? statusesCount : '?'}</span>
</div>
)
}
export default StatusesCountBadge