mirror of
https://github.com/sigmasternchen/threadule
synced 2025-03-15 08:09:01 +00:00
feat: thread list displays news threads
This commit is contained in:
parent
4cf60ab448
commit
b85573eb1a
4 changed files with 56 additions and 41 deletions
|
@ -13,6 +13,7 @@ import Account from "../../api/entities/Account";
|
|||
import Thread from "../../api/entities/Thread";
|
||||
import AddIcon from "@material-ui/icons/Add";
|
||||
import {TweetStatus} from "../../api/entities/Tweet";
|
||||
import CustomDate from "../../utils/CustomDate";
|
||||
|
||||
export type ThreadFormProps = {
|
||||
open: boolean
|
||||
|
@ -21,37 +22,6 @@ export type ThreadFormProps = {
|
|||
onSubmit: (thread: Thread) => void
|
||||
}
|
||||
|
||||
class CustomDate extends Date {
|
||||
constructor(date?: Date) {
|
||||
super(date ? date : new Date())
|
||||
}
|
||||
|
||||
public toLocalISOString(milliseconds: boolean = true,
|
||||
timezone: boolean = true): string {
|
||||
let result =
|
||||
this.getFullYear() + "-" +
|
||||
(String(this.getMonth()).padStart(2, "0")) + "-" +
|
||||
(String(this.getDay()).padStart(2, "0")) + "T" +
|
||||
(String(this.getHours()).padStart(2, "0")) + ":" +
|
||||
(String(this.getMinutes()).padStart(2, "0")) + ":" +
|
||||
(String(this.getSeconds()).padStart(2, "0"))
|
||||
if (milliseconds) {
|
||||
result += "." + (String(this.getMilliseconds()).padStart(3, "0"))
|
||||
}
|
||||
if (timezone) {
|
||||
const offset = -this.getTimezoneOffset()
|
||||
const hourOffset = Math.floor(Math.abs(offset) / 60)
|
||||
const minuteOffset = offset % 60
|
||||
result +=
|
||||
(offset > 0 ? "+" : "-") +
|
||||
(String(hourOffset).padStart(2, "0")) +
|
||||
(String(minuteOffset).padStart(2, "0"))
|
||||
}
|
||||
|
||||
return result
|
||||
}
|
||||
}
|
||||
|
||||
const Index: FunctionComponent<ThreadFormProps> = ({open, account, initial, onSubmit}) => {
|
||||
const [thread, setThread] = useState<Thread>(initial)
|
||||
|
||||
|
|
7
frontend/src/components/ThreadList/ThreadList.module.css
Normal file
7
frontend/src/components/ThreadList/ThreadList.module.css
Normal file
|
@ -0,0 +1,7 @@
|
|||
.title {
|
||||
text-overflow: ellipsis;
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
white-space:nowrap;
|
||||
}
|
|
@ -1,6 +1,8 @@
|
|||
import {FunctionComponent} from "react";
|
||||
import {Avatar, List, ListItem, ListItemAvatar, ListItemText, Typography} from "@material-ui/core";
|
||||
import Thread from "../../api/entities/Thread";
|
||||
import CustomDate from "../../utils/CustomDate";
|
||||
import styles from "./ThreadList.module.css"
|
||||
|
||||
|
||||
export type ThreadListProps = {
|
||||
|
@ -19,16 +21,20 @@ const ThreadList: FunctionComponent<ThreadListProps> = ({threads}) => {
|
|||
} else {
|
||||
return (
|
||||
<List>
|
||||
{threads.map(thread => (
|
||||
<ListItem key={thread.id}>
|
||||
<ListItemAvatar>
|
||||
<Avatar>
|
||||
{thread.id}
|
||||
</Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText primary="Thread" secondary={thread.scheduled_for}/>
|
||||
</ListItem>
|
||||
))}
|
||||
{threads.map(thread => {
|
||||
return (
|
||||
<ListItem key={thread.id}>
|
||||
<ListItemAvatar>
|
||||
<Avatar>
|
||||
{thread.id}
|
||||
</Avatar>
|
||||
</ListItemAvatar>
|
||||
<ListItemText
|
||||
primary={<span className={styles.title}>{thread.tweets[0].text}</span>}
|
||||
secondary={new CustomDate(thread.scheduled_for).toLocalISOString(false, true)}/>
|
||||
</ListItem>
|
||||
)
|
||||
})}
|
||||
</List>
|
||||
)
|
||||
}
|
||||
|
|
32
frontend/src/utils/CustomDate.ts
Normal file
32
frontend/src/utils/CustomDate.ts
Normal file
|
@ -0,0 +1,32 @@
|
|||
class CustomDate extends Date {
|
||||
constructor(date?: Date) {
|
||||
super(date ? date : new Date())
|
||||
}
|
||||
|
||||
public toLocalISOString(milliseconds: boolean = true,
|
||||
timezone: boolean = true): string {
|
||||
let result =
|
||||
this.getFullYear() + "-" +
|
||||
(String(this.getMonth()).padStart(2, "0")) + "-" +
|
||||
(String(this.getDay()).padStart(2, "0")) + "T" +
|
||||
(String(this.getHours()).padStart(2, "0")) + ":" +
|
||||
(String(this.getMinutes()).padStart(2, "0")) + ":" +
|
||||
(String(this.getSeconds()).padStart(2, "0"))
|
||||
if (milliseconds) {
|
||||
result += "." + (String(this.getMilliseconds()).padStart(3, "0"))
|
||||
}
|
||||
if (timezone) {
|
||||
const offset = -this.getTimezoneOffset()
|
||||
const hourOffset = Math.floor(Math.abs(offset) / 60)
|
||||
const minuteOffset = offset % 60
|
||||
result +=
|
||||
(offset > 0 ? "+" : "-") +
|
||||
(String(hourOffset).padStart(2, "0")) +
|
||||
(String(minuteOffset).padStart(2, "0"))
|
||||
}
|
||||
|
||||
return result
|
||||
}
|
||||
}
|
||||
|
||||
export default CustomDate
|
Loading…
Reference in a new issue