File indexing completed on 2025-01-26 05:27:59 

0001 import React, { useState, useEffect } from 'react';
0002 import Axios from 'axios';
0003 
0004 const MastodonContainer = (props) => {
0005     const [items, setItems] = useState([]);
0006 
0007   useEffect(() => {
0008     Axios.get(`/json/socialtimeline`)
0009       .then(result => {              
0010         setItems(result.data);
0011       })
0012   }, []);
0013 
0014     return (
0015         <div className="panelContainer">
0016         <div className="title"><a href={props.url_mastodon}>Mastodon</a></div>
0017         <ul>
0018           {items.map((fi, index) => (
0019             <li key={index}>
0020                 <div style={{display:'block',width:'60px',float:'left'}}>
0021                     <img src={fi.account.avatar} style={{width:'48px',height: '48px', borderRadius:'10px'}}></img>
0022                 </div>
0023                 <div style={{width:'100%'}}>
0024                     <span style={{display:'inline-block'}}>{fi.account.username}</span>
0025                     <a className="title" href={fi.url}>
0026                         <span>{fi.content.replace(/(<([^>]+)>)/ig,"")}</span>
0027                     </a>
0028                     <span className="date">{fi.created_at}</span>                
0029                 </div>
0030               
0031             </li>
0032           )
0033           )}
0034         </ul>
0035       </div>
0036     )
0037 }
0038 
0039 export default MastodonContainer;