const widgetProvider = 'frichard5.near'; const refUrl = "https://api.stats.ref.finance/api/ft"; const widgetProposalCountUrl = `https://api.pikespeak.ai/widgets/daos/ndcoverview`; const ftList = fetch(refUrl); const daosList = [ "ndctrust.sputnik-dao.near", "marketing.sputnik-dao.near", "creativesdao.sputnik-dao.near", "neardevgov.sputnik-dao.near", "gwg.sputnik-dao.near", ]; const Balances = ( <Widget src={`${widgetProvider}/widget/NDC-alldaos.aggregated-balances`} props={{ widgetProvider, ftList: ftList.body }} /> ); const Banner = ( <Widget src={`${widgetProvider}/widget/NDC-Banner`} props={{ widgetProvider, ftList: ftList.body }} /> ); const Card = styled.div` box-shadow: 3px 2px 24px rgba(68, 152, 224, 0.3); border-radius: 4px; padding: 20px; margin-top: 40px;` return <> {Banner} <Card> <h1>All NDC daos overview</h1> <p>Click on any link to access detailed dao dashboard.</p> <p style={{maxWidth: "300px" }}> {daosList.map((dao) => <a href={`https://near.org/${widgetProvider}/widget/NDC-Page?selected_dao=${dao}`} target="_blank" > {dao} </a>)} </p> </Card> {Balances} <> <iframe style={{ width: "100%", height: "440px", marginTop: "40px" }} src={widgetProposalCountUrl} ></iframe> </> </>