| 6 | "": "let { contractName } = VM.require(`ndcdev.near/widget/daos.Config`);\\\\nconst {\\\\n item,\\\\n index,\\\\n showMoreDefault,\\\\n showCommentsDefault,\\\\n type,\\\\n preview,\\\\n isMobile,\\\\n rowId,\\\\n id,\\\\n disabeleOpenReportLInk,\\\\n} = props;\\\\nconst GAS = \\\\\\\"200000000000000\\\\\\\";\\\\nconst DEPOSIT = 10000000000000000000000;\\\\n\\\\nif (!item || !rowId || !contractName)\\\\n return <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\n\\\\nconst [itemState, setItemState] = useState(item);\\\\nconst [snapshot, setSnapshot] = useState(item);\\\\nconst [showMore, setShowMore] = useState(null);\\\\nconst [showComments, setShowComments] = useState(showCommentsDefault);\\\\nconst [selectedHistoryId, setSelectedHistoryId] = useState(0);\\\\nconst accountId = context.accountId;\\\\n\\\\nconst dao = Near.view(contractName, \\\\\\\"get_dao_by_id\\\\\\\", {\\\\n id: parseInt(itemState.dao_id),\\\\n});\\\\n\\\\nif (!dao || !itemState) return <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\n\\\\nconst TableRow = styled.div`\\\\n display: flex;\\\\n border-bottom: ${(props) => (props.showMore ? \\\\\\\"0\\\\\\\" : \\\\\\\"1px solid #e3e3e0\\\\\\\")};\\\\n\\\\n &:hover {\\\\n background: #fff;\\\\n border-bottom: 1px solid rgba(0, 0, 0, 0.05);\\\\n box-shadow:\\\\n 0px 97px 27px 0px rgba(0, 0, 0, 0),\\\\n 0px 62px 25px 0px rgba(0, 0, 0, 0),\\\\n 0px 35px 21px 0px rgba(0, 0, 0, 0.02),\\\\n 0px 16px 16px 0px rgba(0, 0, 0, 0.03),\\\\n 0px 4px 9px 0px rgba(0, 0, 0, 0.03);\\\\n }\\\\n`;\\\\n\\\\nconst TableCell = styled.div`\\\\n padding: 16px;\\\\n display: flex;\\\\n align-items: center;\\\\n column-gap: 10px;\\\\n row-gap: 3px;\\\\n flex: ${(props) => props.flex || 1};\\\\n\\\\n .title {\\\\n overflow: hidden;\\\\n display: -webkit-box;\\\\n -webkit-line-clamp: 1;\\\\n line-clamp: 1;\\\\n -webkit-box-orient: vertical;\\\\n }\\\\n\\\\n .info {\\\\n display: flex;\\\\n flex-direction: column;\\\\n }\\\\n\\\\n .account-link {\\\\n overflow: hidden;\\\\n text-overflow: ellipsis;\\\\n max-width: 150px;\\\\n }\\\\n\\\\n &.dao {\\\\n min-width: 265px;\\\\n max-width: 265px;\\\\n }\\\\n\\\\n &.proposal-states {\\\\n flex-wrap: wrap;\\\\n }\\\\n`;\\\\n\\\\nconst ProposalCardWrapper = styled.div`\\\\n display: flex;\\\\n background: white;\\\\n border-radius: 14px;\\\\n border: 1px solid #e3e3e0;\\\\n background: #fdfdfd;\\\\n padding: 18px 22px;\\\\n margin: 20px;\\\\n align-items: center;\\\\n flex-direction: column;\\\\n align-items: flex-end;\\\\n`;\\\\n\\\\nconst StatusBadge = styled.span`\\\\n display: flex;\\\\n width: 86px;\\\\n height: 30px;\\\\n padding: 6px 12px;\\\\n justify-content: center;\\\\n align-items: center;\\\\n font-size: 14px;\\\\n gap: 10px;\\\\n flex-shrink: 0;\\\\n border-radius: 4px;\\\\n background-color: ${(props) => props.background};\\\\n color: ${(props) => props.color};\\\\n border: 1px solid ${(props) => props.border};\\\\n`;\\\\n\\\\nconst statusColors = {\\\\n New: { background: \\\\\\\"#8A92F9\\\\\\\", color: \\\\\\\"white\\\\\\\", border: \\\\\\\"#8A92F9\\\\\\\" },\\\\n Approved: { background: \\\\\\\"#2CE691\\\\\\\", color: \\\\\\\"white\\\\\\\", border: \\\\\\\"#2CE691\\\\\\\" },\\\\n Closed: { background: \\\\\\\"#CCC\\\\\\\", color: \\\\\\\"white\\\\\\\", border: \\\\\\\"#CCC\\\\\\\" },\\\\n InReview: { background: \\\\\\\"#F6B86A\\\\\\\", color: \\\\\\\"white\\\\\\\", border: \\\\\\\"#F6B86A\\\\\\\" },\\\\n Rejected: { background: \\\\\\\"#FC6F60\\\\\\\", color: \\\\\\\"white\\\\\\\", border: \\\\\\\"#FC6F60\\\\\\\" },\\\\n};\\\\n\\\\nconst ProposalsState = styled.div`\\\\n display: flex;\\\\n height: 30px;\\\\n width: max-content;\\\\n padding: 2px 6px 2px 4px;\\\\n align-items: center;\\\\n gap: 6px;\\\\n border-radius: 4px;\\\\n border: 1px solid #e0f2ea;\\\\n background: #fff;\\\\n font-size: 12px;\\\\n font-weight: 600;\\\\n color: #828282;\\\\n\\\\n i {\\\\n color: ${(props) => (props.approve ? \\\\\\\"#2CE691\\\\\\\" : \\\\\\\"#FC6F60\\\\\\\")};\\\\n }\\\\n`;\\\\n\\\\nconst ExpandCollapseIcon = styled.div`\\\\n display: flex;\\\\n align-items: center;\\\\n padding-left: 30px;\\\\n cursor: pointer;\\\\n`;\\\\n\\\\nconst Container = styled.div`\\\\n display: flex;\\\\n gap: 10px;\\\\n\\\\n .dao-img {\\\\n width: 32px;\\\\n height: 32px;\\\\n border-radius: 50%;\\\\n }\\\\n\\\\n .title {\\\\n color: #000;\\\\n font-size: 16px;\\\\n font-style: normal;\\\\n }\\\\n\\\\n .created {\\\\n color: #828282;\\\\n font-size: 12px;\\\\n font-style: normal;\\\\n font-weight: 500;\\\\n }\\\\n\\\\n .date {\\\\n font-size: 12px;\\\\n font-style: normal;\\\\n font-weight: 500;\\\\n }\\\\n`;\\\\n\\\\nconst ProposalCard = styled.div`\\\\n width: 100%;\\\\n display: flex;\\\\n gap: 32px;\\\\n`;\\\\n\\\\nconst ProposalContent = styled.div`\\\\n display: flex;\\\\n flex-direction: column;\\\\n flex: 1;\\\\n padding-right: 20px;\\\\n max-width: ${(props) => props.maxWidth};\\\\n`;\\\\n\\\\nconst ProposalHeader = styled.div`\\\\n font-size: 20px;\\\\n font-weight: bold;\\\\n`;\\\\n\\\\nconst ProposalInfo = styled.div`\\\\n display: flex;\\\\n flex-direction: column;\\\\n font-size: 14px;\\\\n color: #666;\\\\n`;\\\\n\\\\nconst ProposalInfoItem = styled.div`\\\\n display: flex;\\\\n font-size: 14px;\\\\n justify-content: space-between;\\\\n align-items: center;\\\\n padding: 0.75rem 0;\\\\n\\\\n &:not(:last-child) {\\\\n border-bottom: 1px solid #e1e1e1;\\\\n }\\\\n\\\\n .value {\\\\n color: var(--NEAR-Primary-Colors-Black-Variation-1, #000);\\\\n font-size: 20px;\\\\n font-style: normal;\\\\n font-weight: 700;\\\\n line-height: normal;\\\\n }\\\\n\\\\n .time {\\\\n color: var(--NEAR-Primary-Colors-Black-Variation-1, #000);\\\\n font-size: 14px;\\\\n font-style: normal;\\\\n font-weight: 500;\\\\n line-height: normal;\\\\n }\\\\n`;\\\\n\\\\nconst Description = styled.div`\\\\n display: flex;\\\\n width: 80%;\\\\n`;\\\\n\\\\nconst Tags = styled.div`\\\\n display: flex;\\\\n flex-wrap: wrap;\\\\n gap: 10px;\\\\n margin-bottom: 10px;\\\\n`;\\\\n\\\\nconst Tag = styled.span`\\\\n background: #e1e1e1;\\\\n border-radius: 10px;\\\\n padding: 5px 10px;\\\\n font-size: 12px;\\\\n`;\\\\n\\\\nconst Button = styled.button`\\\\n background: #007aff;\\\\n color: white;\\\\n border: none;\\\\n padding: 10px 20px;\\\\n border-radius: 20px;\\\\n font-size: 14px;\\\\n cursor: pointer;\\\\n &:hover {\\\\n background: #0056b3;\\\\n }\\\\n`;\\\\n\\\\nconst MobileContainer = styled.div`\\\\n display: flex;\\\\n flex-direction: column;\\\\n gap: 1rem;\\\\n width: 100%;\\\\n border-radius: 12px;\\\\n border: 1px solid #e3e3e0;\\\\n background: #fff;\\\\n padding: 14px 12px 24px 12px;\\\\n box-shadow:\\\\n 0px 97px 27px 0px rgba(0, 0, 0, 0),\\\\n 0px 62px 25px 0px rgba(0, 0, 0, 0),\\\\n 0px 35px 21px 0px rgba(0, 0, 0, 0.02),\\\\n 0px 16px 16px 0px rgba(0, 0, 0, 0.03),\\\\n 0px 4px 9px 0px rgba(0, 0, 0, 0.03);\\\\n\\\\n @media screen and (min-width: 768px) {\\\\n display: none;\\\\n }\\\\n`;\\\\n\\\\nconst DesktopVersion = styled.div`\\\\n @media screen and (max-width: 768px) {\\\\n display: none;\\\\n }\\\\n`;\\\\n\\\\nconst Breadcrumbs = styled.div`\\\\n display: flex;\\\\n justify-content: flex-start;\\\\n width: 100%;\\\\n border-bottom: 1px solid\\\\n var(--NEAR-Primary-Colors-Off-White-Variation-1, #f0efe7);\\\\n padding-bottom: 14px;\\\\n font-size: 14px;\\\\n margin-bottom: 30px;\\\\n font-weight: 600;\\\\n justify-content: space-between;\\\\n\\\\n .all-link {\\\\n color: #7e7d7e;\\\\n }\\\\n`;\\\\nconst InfoContainer = styled.div`\\\\n display: flex;\\\\n width: 100%;\\\\n flex-direction: row;\\\\n justify-content: space-between;\\\\n\\\\n .created {\\\\n color: #5c656a;\\\\n font-size: 12px;\\\\n font-style: normal;\\\\n font-weight: 500;\\\\n }\\\\n\\\\n .edit-text {\\\\n display: flex;\\\\n\\\\n @media screen and (max-width: 768px) {\\\\n display: none;\\\\n }\\\\n }\\\\n\\\\n @media screen and (max-width: 786px) {\\\\n flex-direction: column;\\\\n }\\\\n`;\\\\n\\\\nconst Left = styled.div`\\\\n width: 60%;\\\\n display: flex;\\\\n gap: 1rem;\\\\n flex-direction: column;\\\\n\\\\n .author {\\\\n margin-left: 10px;\\\\n }\\\\n\\\\n @media screen and (max-width: 786px) {\\\\n width: 100%;\\\\n }\\\\n`;\\\\nconst Right = styled.div`\\\\n display: flex;\\\\n flex-direction: column;\\\\n gap: 20px;\\\\n`;\\\\n\\\\nconst DescriptionContainer = styled.div`\\\\n padding-top: 42px;\\\\n width: 100%;\\\\n display: flex;\\\\n flex-direction: column;\\\\n align-items: flex-start;\\\\n gap: 20px;\\\\n`;\\\\n\\\\nconst Social = styled.div`\\\\n width: 100%;\\\\n padding: 12px;\\\\n border-top: 1px solid #f0efe7;\\\\n display: flex;\\\\n gap: 20px;\\\\n`;\\\\n\\\\nconst Comments = styled.div`\\\\n width: 100%;\\\\n border-top: 1px solid #efefef;\\\\n padding-top: 1rem;\\\\n @media screen and (max-width: 786px) {\\\\n overflow: auto;\\\\n }\\\\n`;\\\\n\\\\nconst HistoryContainer = styled.div`\\\\n min-height: 50px;\\\\n max-height: 200px;\\\\n overflow-y: auto;\\\\n border-left: 1px solid #f0efe7;\\\\n`;\\\\n\\\\nconst HistoryEntry = styled.div`\\\\n padding: 10px 24px;\\\\n font-size: 14px;\\\\n background-color: ${(props) => (props.selected ? \\\\\\\"#F5F6FE;\\\\\\\" : \\\\\\\"white\\\\\\\")};\\\\n border-left: ${(props) => (props.selected ? \\\\\\\"2px solid #626AD1\\\\\\\" : \\\\\\\"none\\\\\\\")};\\\\n cursor: pointer;\\\\n\\\\n .text {\\\\n color: #666;\\\\n }\\\\n\\\\n .owner {\\\\n font-size: 12px;\\\\n }\\\\n\\\\n &:hover {\\\\n background-color: #f2f2f2;\\\\n }\\\\n`;\\\\n\\\\nconst ProposalsStateContainer = styled.div`\\\\n display: flex;\\\\n gap: 10px;\\\\n padding-top: 10px;\\\\n\\\\n @media screen and (max-width: 786px) {\\\\n flex-wrap: wrap;\\\\n }\\\\n`;\\\\n\\\\nconst Info = styled.div`\\\\n display: flex;\\\\n justify-content: space-between;\\\\n @media screen and (max-width: 786px) {\\\\n padding-bottom: 10px;\\\\n }\\\\n`;\\\\n\\\\nconst HistoryTitle = styled.div`\\\\n display: flex;\\\\n align-items: center;\\\\n gap: 8px;\\\\n font-size: 16px;\\\\n font-style: normal;\\\\n font-weight: 500;\\\\n`;\\\\n\\\\nconst ClipboardContainer = styled.div`\\\\n width: 20%;\\\\n`;\\\\n\\\\nconst changeHistory = (index) => {\\\\n setSelectedHistoryId(index);\\\\n setItemState((prev) => ({ ...prev, ...snapshot[index] }));\\\\n};\\\\n\\\\nconst formatDate = (date) => new Date(date / 1000000).toLocaleString();\\\\n\\\\nif (!dao) return <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\n\\\\nlet snap;\\\\n\\\\nif (itemState && itemState.id)\\\\n snap = Near.view(contractName, \\\\\\\"get_post_history\\\\\\\", {\\\\n id: itemState.id,\\\\n });\\\\n\\\\nuseEffect(() => {\\\\n if (snap)\\\\n setSnapshot([item, ...snap.sort((a, b) => b.timestamp - a.timestamp)]);\\\\n}, [snap]);\\\\n\\\\nconst isLiked = (item) => {\\\\n return item.likes && item.likes.find((item) => item.author_id === accountId);\\\\n};\\\\n\\\\nconst handleLike = () => {\\\\n if (isLiked(itemState)) return;\\\\n if (!accountId) return;\\\\n Near.call(\\\\n contractName,\\\\n isLiked(itemState) ? \\\\\\\"post_unlike\\\\\\\" : \\\\\\\"post_like\\\\\\\",\\\\n {\\\\n id: itemState.id,\\\\n },\\\\n GAS,\\\\n DEPOSIT\\\\n );\\\\n};\\\\n\\\\nconst handleShowComments = () => {\\\\n if (!accountId) return;\\\\n setShowComments(!showComments);\\\\n};\\\\n\\\\nconst changeStatus = async (item, status) => {\\\\n if (!accountId) return;\\\\n Near.call(\\\\n contractName,\\\\n \\\\\\\"change_post_status\\\\\\\",\\\\n {\\\\n id: item.id,\\\\n status,\\\\n },\\\\n GAS,\\\\n DEPOSIT\\\\n );\\\\n};\\\\n\\\\nconst handleSpam = () => {\\\\n if (!accountId) return;\\\\n Near.call(\\\\n contractName,\\\\n \\\\\\\"change_post_is_spam\\\\\\\",\\\\n {\\\\n id: itemState.id,\\\\n is_spam: !itemState.is_spam,\\\\n },\\\\n GAS,\\\\n DEPOSIT\\\\n );\\\\n};\\\\n\\\\nif (!dao) return <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\n\\\\nconst statuses = [\\\\n { key: \\\\\\\"InReview\\\\\\\", value: \\\\\\\"In Review\\\\\\\" },\\\\n { key: \\\\\\\"New\\\\\\\", value: \\\\\\\"New\\\\\\\" },\\\\n { key: \\\\\\\"Approved\\\\\\\", value: \\\\\\\"Approved\\\\\\\" },\\\\n { key: \\\\\\\"Rejected\\\\\\\", value: \\\\\\\"Rejected\\\\\\\" },\\\\n { key: \\\\\\\"Closed\\\\\\\", value: \\\\\\\"Closed\\\\\\\" },\\\\n];\\\\n\\\\nreturn (\\\\n <>\\\\n {/* This is to be used with single report */}\\\\n {id ? (\\\\n <>\\\\n <Breadcrumbs>\\\\n <div>\\\\n <a\\\\n className=\\\\\\\"all-link\\\\\\\"\\\\n href={`/ndcdev.near/widget/daos.App?page=proposals`}\\\\n >\\\\n All {itemState.post_type === \\\\\\\"Proposal\\\\\\\" ? \\\\\\\"Proposals\\\\\\\" : \\\\\\\"Reports\\\\\\\"}\\\\n </a>\\\\n {\\\\\\\" / \\\\\\\"}\\\\n {itemState.title}\\\\n </div>\\\\n </Breadcrumbs>\\\\n\\\\n <InfoContainer>\\\\n <Left>\\\\n <Info>\\\\n <div className=\\\\\\\"d-flex\\\\\\\">\\\\n <Widget\\\\n src=\\\\\\\"near/widget/AccountProfile\\\\\\\"\\\\n props={{\\\\n accountId: itemState.author_id,\\\\n }}\\\\n />\\\\n </div>\\\\n <div className=\\\\\\\"d-flex align-items-center gap-2\\\\\\\">\\\\n {dao.owners.includes(accountId) ? (\\\\n <div>\\\\n <select\\\\n className=\\\\\\\"form-control\\\\\\\"\\\\n value={itemState.status}\\\\n onChange={(status) =>\\\\n changeStatus(item, status.target.value)\\\\n }\\\\n >\\\\n {statuses.map(({ key, value }) => (\\\\n <option value={key}>{value}</option>\\\\n ))}\\\\n </select>\\\\n </div>\\\\n ) : (\\\\n <StatusBadge {...statusColors[itemState.status]}>\\\\n {itemState.status}\\\\n </StatusBadge>\\\\n )}\\\\n\\\\n <div>\\\\n {itemState.author_id === accountId && (\\\\n <>\\\\n {itemState.status === \\\\\\\"InReview\\\\\\\" ? (\\\\n <a\\\\n className=\\\\\\\"btn-primary btn-icon fs-6\\\\\\\"\\\\n href={`https://near.org/ndcdev.near/widget/daos.App?page=edit_post&id=${itemState.id}&dao_id=${dao.handle}`}\\\\n >\\\\n <i className=\\\\\\\"ph ph-pencil-simple\\\\\\\" />\\\\n <span className=\\\\\\\"edit-text\\\\\\\">Edit</span>\\\\n </a>\\\\n ) : (\\\\n <OverlayTrigger\\\\n placement=\\\\\\\"auto\\\\\\\"\\\\n overlay={\\\\n <Tooltip>\\\\n Only \\\\\\\"In Review\\\\\\\" proposal can be edited\\\\n </Tooltip>\\\\n }\\\\n >\\\\n <div className=\\\\\\\"btn-secondary btn-icon outlined\\\\\\\">\\\\n <i className=\\\\\\\"ph ph-pencil-simple fs-6\\\\\\\" />\\\\n <span className=\\\\\\\"edit-text\\\\\\\">Edit</span>\\\\n </div>\\\\n </OverlayTrigger>\\\\n )}\\\\n </>\\\\n )}\\\\n </div>\\\\n </div>\\\\n </Info>\\\\n <div>\\\\n <ProposalHeader>{itemState.title}</ProposalHeader>\\\\n <ProposalsStateContainer>\\\\n <Widget\\\\n src={\\\\\\\"ndcdev.near/widget/daos.Components.Clipboard\\\\\\\"}\\\\n props={{\\\\n text: `https://near.org/ndcdev.near/widget/daos.App?page=proposal&id=${itemState.id}`,\\\\n }}\\\\n />\\\\n <ProposalsState approve={itemState.state.dao_council_approved}>\\\\n <span>\\\\n {itemState.state.dao_council_approved ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>{\\\\\\\" \\\\\\\"}\\\\n DAO Approved\\\\n </ProposalsState>\\\\n\\\\n <ProposalsState approve={itemState.state.kyc_passed}>\\\\n {\\\\\\\" \\\\\\\"}\\\\n <span>\\\\n {itemState.state.kyc_passed ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>{\\\\\\\" \\\\\\\"}\\\\n KYC Approved\\\\n </ProposalsState>\\\\n\\\\n <ProposalsState approve={itemState.state.report_accepted}>\\\\n {\\\\\\\" \\\\\\\"}\\\\n <span>\\\\n {itemState.state.report_accepted ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>{\\\\\\\" \\\\\\\"}\\\\n Report Approved\\\\n </ProposalsState>\\\\n </ProposalsStateContainer>\\\\n </div>\\\\n <ProposalInfo>\\\\n <ProposalInfoItem>\\\\n <div>Created at:</div>\\\\n <div style={{ color: \\\\\\\"#000\\\\\\\" }}>\\\\n {formatDate(itemState.created_at)}\\\\n </div>\\\\n </ProposalInfoItem>\\\\n <ProposalInfoItem>\\\\n <div>Updated at:</div>\\\\n <div style={{ color: \\\\\\\"#000\\\\\\\" }}>\\\\n {formatDate(itemState.timestamp)}\\\\n </div>\\\\n </ProposalInfoItem>\\\\n <ProposalInfoItem>\\\\n <div>Requested amount:</div>\\\\n <div style={{ color: \\\\\\\"#000\\\\\\\" }} className=\\\\\\\"value\\\\\\\">\\\\n ${itemState.requested_amount ?? 0}\\\\n </div>\\\\n </ProposalInfoItem>\\\\n </ProposalInfo>\\\\n </Left>\\\\n\\\\n <Right>\\\\n <HistoryTitle>\\\\n <i class=\\\\\\\"ph ph-clock-counter-clockwise fs-5\\\\\\\"></i>\\\\n <span>Version History</span>\\\\n </HistoryTitle>\\\\n <div>\\\\n <HistoryContainer>\\\\n {snapshot.map((history, index) => (\\\\n <HistoryEntry\\\\n key={history.timestamp}\\\\n selected={index === selectedHistoryId}\\\\n onClick={() => changeHistory(index)}\\\\n >\\\\n <>\\\\n <div>\\\\n <span className=\\\\\\\"text\\\\\\\">\\\\n {snapshot.length - 1 === index\\\\n ? \\\\\\\"Created at:\\\\\\\"\\\\n : \\\\\\\"Updated at:\\\\\\\"}\\\\n </span>\\\\n <span>\\\\n {new Date(\\\\n history.timestamp / 1000000\\\\n ).toLocaleString()}\\\\n </span>\\\\n </div>\\\\n <div className=\\\\\\\"owner\\\\\\\">\\\\n <span className=\\\\\\\"text\\\\\\\">by</span>\\\\n <span>{history.editor_id}</span>\\\\n </div>\\\\n </>\\\\n </HistoryEntry>\\\\n ))}\\\\n </HistoryContainer>\\\\n </div>\\\\n </Right>\\\\n </InfoContainer>\\\\n <DescriptionContainer>\\\\n <ProposalHeader>Description</ProposalHeader>\\\\n\\\\n {itemState.labels.length > 0 && (\\\\n <Tags>\\\\n {itemState.labels?.map((tag) => (\\\\n <Tag>#{tag}</Tag>\\\\n ))}\\\\n </Tags>\\\\n )}\\\\n\\\\n <Description>\\\\n <Widget\\\\n src=\\\\\\\"ndcdev.near/widget/daos.Components.MarkdownViewer\\\\\\\"\\\\n props={{ text: itemState.description }}\\\\n />\\\\n </Description>\\\\n <Social>\\\\n <div\\\\n role=\\\\\\\"button\\\\\\\"\\\\n className=\\\\\\\"d-flex gap-2 align-items-center\\\\\\\"\\\\n onClick={handleLike}\\\\n >\\\\n <i\\\\n className={` ph-heart fs-5 ${\\\\n isLiked(itemState) ? \\\\\\\"ph-fill\\\\\\\" : \\\\\\\"ph\\\\\\\"\\\\n }`}\\\\n />\\\\n <span>{itemState.likes.length}</span>\\\\n </div>\\\\n\\\\n <div\\\\n role=\\\\\\\"button\\\\\\\"\\\\n className=\\\\\\\"d-flex gap-2 align-items-center\\\\\\\"\\\\n onClick={handleShowComments}\\\\n >\\\\n <i className=\\\\\\\"ph ph-chat-circle fs-5\\\\\\\" />\\\\n <span>{itemState.comments.length}</span>\\\\n </div>\\\\n <div role=\\\\\\\"button\\\\\\\">\\\\n <Widget\\\\n src={\\\\\\\"ndcdev.near/widget/daos.Components.Share\\\\\\\"}\\\\n props={{\\\\n text: `https://near.org/ndcdev.near/widget/daos.App?page=proposal&id=${itemState.id}`,\\\\n }}\\\\n />\\\\n </div>\\\\n {dao.owners.includes(accountId) && (\\\\n <div\\\\n role=\\\\\\\"button\\\\\\\"\\\\n className=\\\\\\\"d-flex gap-2 align-items-center\\\\\\\"\\\\n onClick={handleSpam}\\\\n >\\\\n <i\\\\n className={`ph ph-flag ${\\\\n itemState.is_spam ? \\\\\\\"red ph-fill\\\\\\\" : \\\\\\\"ph\\\\\\\"\\\\n }`}\\\\n />\\\\n </div>\\\\n )}\\\\n </Social>\\\\n </DescriptionContainer>\\\\n {showComments && (\\\\n <Comments>\\\\n <Widget\\\\n src=\\\\\\\"ndcdev.near/widget/daos.Components.Comments\\\\\\\"\\\\n props={{\\\\n postId: item.id,\\\\n showCreate: true,\\\\n }}\\\\n />\\\\n </Comments>\\\\n )}\\\\n </>\\\\n ) : (\\\\n <>\\\\n {/* This is to be used with Table */}\\\\n <MobileContainer>\\\\n <div className=\\\\\\\"d-flex justify-content-between align-items-center\\\\\\\">\\\\n <Container>\\\\n <div>\\\\n <img className=\\\\\\\"dao-img\\\\\\\" src={dao.logo_url} />\\\\n </div>\\\\n <div className=\\\\\\\"d-flex flex-column\\\\\\\">\\\\n <span className=\\\\\\\"title\\\\\\\">{dao.title}</span>\\\\n <div>\\\\n <span className=\\\\\\\"created\\\\\\\">Updated at:</span>{\\\\\\\" \\\\\\\"}\\\\n <span className=\\\\\\\"date\\\\\\\">\\\\n {new Date(\\\\n itemState.timestamp / 1000000\\\\n ).toLocaleDateString()}\\\\n </span>\\\\n </div>\\\\n </div>\\\\n </Container>\\\\n <StatusBadge {...statusColors[itemState.status]}>\\\\n {itemState.status}\\\\n </StatusBadge>\\\\n </div>\\\\n <ProposalHeader>{itemState.title}</ProposalHeader>\\\\n <ProposalInfo>\\\\n <ClipboardContainer>\\\\n <Widget\\\\n src={\\\\\\\"ndcdev.near/widget/daos.Components.Clipboard\\\\\\\"}\\\\n props={{\\\\n text: `https://near.org/ndcdev.near/widget/daos.App?page=proposal&id=${itemState.id}`,\\\\n }}\\\\n />\\\\n </ClipboardContainer>\\\\n <ProposalInfoItem>\\\\n <div>Internal</div>\\\\n <ProposalsState approve={itemState.state.dao_council_approved}>\\\\n <span>\\\\n {itemState.state.dao_council_approved ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>\\\\n DAO Approved\\\\n </ProposalsState>\\\\n </ProposalInfoItem>\\\\n <ProposalInfoItem>\\\\n <div>KYC</div>\\\\n <ProposalsState approve={itemState.state.kyc_passed}>\\\\n <span>\\\\n {itemState.state.kyc_passed ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>\\\\n KYC Approved\\\\n </ProposalsState>\\\\n </ProposalInfoItem>\\\\n <ProposalInfoItem>\\\\n <div>Report</div>\\\\n <ProposalsState approve={itemState.state.report_accepted}>\\\\n <span>\\\\n {itemState.state.report_accepted ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>\\\\n Report Approved\\\\n </ProposalsState>\\\\n </ProposalInfoItem>\\\\n\\\\n <ProposalInfoItem>\\\\n <div>Created By:</div>\\\\n <div>\\\\n <a\\\\n className=\\\\\\\"account-link\\\\\\\"\\\\n href={`https://near.org/near/widget/ProfilePage?accountId=${itemState.author_id}`}\\\\n >\\\\n {itemState.author_id}\\\\n </a>\\\\n </div>\\\\n </ProposalInfoItem>\\\\n <ProposalInfoItem>\\\\n <div>Requested amount:</div>\\\\n <div>\\\\n <b>${itemState.requested_amount ?? 0}</b>\\\\n </div>\\\\n </ProposalInfoItem>\\\\n </ProposalInfo>\\\\n {!id && (\\\\n <div className=\\\\\\\"d-flex justify-content-between align-items-center gap-3\\\\\\\">\\\\n {itemState.post_type === \\\\\\\"Proposal\\\\\\\" ? (\\\\n <div className=\\\\\\\"d-flex justify-content-end w-100\\\\\\\">\\\\n <a\\\\n className=\\\\\\\"btn btn-secondary w-100 text-nowrap\\\\\\\"\\\\n href={`/ndcdev.near/widget/daos.App?page=proposal&id=${itemState.id}`}\\\\n >\\\\n Open Proposal\\\\n <i class=\\\\\\\"ph ph-arrow-square-out fs-6\\\\\\\"></i>\\\\n </a>\\\\n </div>\\\\n ) : (\\\\n <div className=\\\\\\\"d-flex justify-content-start w-100\\\\\\\">\\\\n <a\\\\n className=\\\\\\\"btn btn-secondary outlined w-100 text-nowrap\\\\\\\"\\\\n href={`/ndcdev.near/widget/daos.App?page=report&id=${itemState.id}`}\\\\n >\\\\n Report\\\\n </a>\\\\n </div>\\\\n )}\\\\n </div>\\\\n )}\\\\n </MobileContainer>\\\\n <DesktopVersion>\\\\n <TableRow key={index}>\\\\n <TableCell flex={0.5}>\\\\n <StatusBadge {...statusColors[itemState.status]}>\\\\n {itemState.status}\\\\n </StatusBadge>\\\\n </TableCell>\\\\n <TableCell flex={1.5} className=\\\\\\\"dao\\\\\\\">\\\\n <Container>\\\\n <div>\\\\n <img className=\\\\\\\"dao-img\\\\\\\" src={dao.logo_url} />\\\\n </div>\\\\n <div className=\\\\\\\"info\\\\\\\">\\\\n <div className=\\\\\\\"title\\\\\\\">{dao.title}</div>\\\\n <div>\\\\n <span className=\\\\\\\"created\\\\\\\">Created at:</span>{\\\\\\\" \\\\\\\"}\\\\n <span className=\\\\\\\"date\\\\\\\">\\\\n {formatDate(itemState.created_at)}\\\\n </span>\\\\n </div>\\\\n </div>\\\\n </Container>\\\\n </TableCell>\\\\n <TableCell flex={1}>\\\\n <div className=\\\\\\\"info\\\\\\\">\\\\n <div className=\\\\\\\"created\\\\\\\"> Created by</div>\\\\n <a\\\\n className=\\\\\\\"account-link\\\\\\\"\\\\n href={`https://near.org/near/widget/ProfilePage?accountId=${itemState.author_id}`}\\\\n >\\\\n {itemState.author_id}\\\\n </a>\\\\n </div>\\\\n </TableCell>\\\\n <TableCell flex={3} className=\\\\\\\"proposal-states\\\\\\\">\\\\n <ProposalsState approve={itemState.state.dao_council_approved}>\\\\n <span>\\\\n {itemState.state.dao_council_approved ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>\\\\n DAO Approved\\\\n </ProposalsState>\\\\n\\\\n <ProposalsState approve={itemState.state.kyc_passed}>\\\\n <span>\\\\n {itemState.state.kyc_passed ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>\\\\n KYC Approved\\\\n </ProposalsState>\\\\n\\\\n <ProposalsState approve={itemState.state.report_accepted}>\\\\n <span>\\\\n {itemState.state.report_accepted ? (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-check-circle\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph-fill fs-6 ph-x-circle\\\\\\\"></i>\\\\n )}\\\\n </span>\\\\n Report Approved\\\\n </ProposalsState>\\\\n </TableCell>\\\\n <TableCell>\\\\n <a\\\\n className=\\\\\\\"btn btn-secondary outlined\\\\\\\"\\\\n href={`/ndcdev.near/widget/daos.App?page=proposal&id=${itemState.id}`}\\\\n >\\\\n Report\\\\n </a>\\\\n <ExpandCollapseIcon>\\\\n <i\\\\n class={`ph ph-caret-${\\\\n showMore === index ? \\\\\\\"up\\\\\\\" : \\\\\\\"down\\\\\\\"\\\\n } fs-5`}\\\\n onClick={() => setShowMore(showMore === index ? null : index)}\\\\n ></i>\\\\n </ExpandCollapseIcon>\\\\n </TableCell>\\\\n </TableRow>\\\\n {showMore === index && (\\\\n <ProposalCardWrapper>\\\\n <ProposalCard>\\\\n <ProposalContent maxWidth={\\\\\\\"350px\\\\\\\"}>\\\\n <div className=\\\\\\\"d-flex justify-content-between gap-3\\\\\\\">\\\\n <ProposalHeader>{itemState.title}</ProposalHeader>\\\\n <Widget\\\\n src={\\\\\\\"ndcdev.near/widget/daos.Components.Clipboard\\\\\\\"}\\\\n props={{\\\\n text: `https://near.org/ndcdev.near/widget/daos.App?page=proposal&id=${itemState.id}`,\\\\n }}\\\\n />\\\\n </div>\\\\n <ProposalInfo>\\\\n <ProposalInfoItem>\\\\n <div>Updated at:</div>\\\\n <div>\\\\n {itemState.timestamp\\\\n ? new Date(\\\\n itemState.timestamp / 1000000\\\\n ).toLocaleString()\\\\n : new Date().toLocaleDateString()}\\\\n </div>\\\\n </ProposalInfoItem>\\\\n <ProposalInfoItem>\\\\n <div>Requested amount:</div>\\\\n <div>\\\\n <b>${itemState.requested_amount ?? 0}</b>\\\\n </div>\\\\n </ProposalInfoItem>\\\\n </ProposalInfo>\\\\n </ProposalContent>\\\\n <ProposalContent maxWidth={\\\\\\\"850px\\\\\\\"}>\\\\n <Tags>\\\\n {itemState.labels?.map((tag) => (\\\\n <Tag>#{tag}</Tag>\\\\n ))}\\\\n </Tags>\\\\n <Description>\\\\n <Widget\\\\n src=\\\\\\\"ndcdev.near/widget/daos.Components.MarkdownViewer\\\\\\\"\\\\n props={{ text: itemState.description }}\\\\n />\\\\n </Description>\\\\n </ProposalContent>\\\\n </ProposalCard>\\\\n <div>\\\\n <a\\\\n className=\\\\\\\"btn btn-secondary\\\\\\\"\\\\n href={`/ndcdev.near/widget/daos.App?page=proposal&id=${itemState.id}`}\\\\n >\\\\n Open Proposal\\\\n <i class=\\\\\\\"ph ph-arrow-square-out fs-6\\\\\\\"></i>\\\\n </a>\\\\n </div>\\\\n </ProposalCardWrapper>\\\\n )}\\\\n </DesktopVersion>\\\\n </>\\\\n )}\\\\n </>\\\\n);\\\\n" |
| 9 | "": "let { contractName } = VM.require(`ndcdev.near/widget/daos.Config`);\\\\n\\\\nif (!contractName || !Near) return <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\nconst daos = Near.view(contractName, \\\\\\\"get_dao_list\\\\\\\");\\\\n\\\\nlet { dao_id, type, accountId } = props;\\\\n\\\\nlet items = null;\\\\nlet dao = null;\\\\n\\\\nif (dao_id) {\\\\n dao = Near.view(contractName, \\\\\\\"get_dao_by_handle\\\\\\\", {\\\\n handle: dao_id,\\\\n });\\\\n\\\\n if (!dao) <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\n\\\\n items = Near.view(contractName, \\\\\\\"get_dao_posts\\\\\\\", {\\\\n dao_id: dao.id,\\\\n page: 0,\\\\n limit: 100,\\\\n });\\\\n\\\\n if (dao.owners.includes(context.accountId)) {\\\\n const inReviewItems = Near.view(contractName, \\\\\\\"get_dao_posts\\\\\\\", {\\\\n dao_id: dao.id,\\\\n page: 0,\\\\n limit: 100,\\\\n status: \\\\\\\"InReview\\\\\\\",\\\\n });\\\\n\\\\n if (items) {\\\\n items = [...items, ...inReviewItems];\\\\n }\\\\n }\\\\n} else if (accountId) {\\\\n items = Near.view(contractName, \\\\\\\"get_posts_by_author\\\\\\\", {\\\\n author: accountId,\\\\n page: 0,\\\\n limit: 100,\\\\n });\\\\n\\\\n if (items && items.length === 0) {\\\\n items = Near.view(contractName, \\\\\\\"get_all_posts\\\\\\\", { page: 0, limit: 100 });\\\\n accountId = null;\\\\n }\\\\n} else\\\\n items = Near.view(contractName, \\\\\\\"get_all_posts\\\\\\\", { page: 0, limit: 100 });\\\\n\\\\nif (!items) return <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\n\\\\nconst Table = styled.div`\\\\n width: 100%;\\\\n display: flex;\\\\n flex-direction: column;\\\\n margin-bottom: 1rem 0 3rem 0;\\\\n\\\\n .created {\\\\n color: #5c656a;\\\\n font-size: 14px;\\\\n font-style: normal;\\\\n font-weight: 500;\\\\n line-height: normal;\\\\n }\\\\n\\\\n .account-link {\\\\n color: #4855fc;\\\\n }\\\\n\\\\n @media screen and (max-width: 768px) {\\\\n display: none;\\\\n }\\\\n`;\\\\n\\\\nconst TableHeader = styled.div`\\\\n display: flex;\\\\n justify-content: space-between;\\\\n background: #f8f8f8;\\\\n padding: 10px 16px;\\\\n jusify-content: flex-start;\\\\n`;\\\\n\\\\nconst TableHeaderCell = styled.div`\\\\n padding: 0 0 0 10px;\\\\n display: flex;\\\\n flex: ${(props) => props.flex || 1};\\\\n`;\\\\n\\\\nconst Mobile = styled.div`\\\\n display: flex;\\\\n flex-direction: column;\\\\n gap: 2rem;\\\\n width: 100%;\\\\n\\\\n @media screen and (min-width: 768px) {\\\\n display: none;\\\\n }\\\\n`;\\\\n\\\\nconst Select = styled.select`\\\\n border: none;\\\\n max-width: 150px;\\\\n height: 100%;\\\\n background: #f8f8f8;\\\\n\\\\n @media screen and (max-width: 768px) {\\\\n background: unset;\\\\n min-width: 100%;\\\\n font-size: 22px;\\\\n }\\\\n`;\\\\n\\\\nconst MobileHeader = styled.div`\\\\n display: flex;\\\\n justify-content: space-between;\\\\n gap: 1rem;\\\\n align-items: center;\\\\n`;\\\\n\\\\nconst FilterButton = styled.div`\\\\n display: flex;\\\\n width: 50px;\\\\n height: 50px;\\\\n padding: 10px;\\\\n justify-content: center;\\\\n align-items: center;\\\\n border-radius: 95.238px;\\\\n border: 0.952px solid\\\\n var(--NEAR-Primary-Colors-Off-White-Variation-1, #f0efe7);\\\\n background: var(--Primary-Base-White, #fff);\\\\n`;\\\\n\\\\nconst MobileTitle = styled.div`\\\\n color: var(--NEAR-Primary-Colors-Black-Variation-1, #000);\\\\n font-family: \\\\\\\"FK Grotesk\\\\\\\";\\\\n font-size: 20px;\\\\n font-style: normal;\\\\n font-weight: 500;\\\\n line-height: normal;\\\\n`;\\\\n\\\\nconst FiltersContainer = styled.div`\\\\n display: flex;\\\\n height: 768px;\\\\n width: 100%\\\\n padding: 64px 16px 48px 16px;\\\\n flex-direction: column;\\\\n align-items: center;\\\\n gap: 32px;\\\\n flex-shrink: 0;\\\\n border-radius: 14px 14px 0px 0px;\\\\n background: var(--Primary-Base-White, #FFF);\\\\n box-shadow: 0px -305px 85px 0px rgba(0, 0, 0, 0.00), 0px -195px 78px 0px rgba(0, 0, 0, 0.00), 0px -110px 66px 0px rgba(0, 0, 0, 0.01), 0px -49px 49px 0px rgba(0, 0, 0, 0.01), 0px -12px 27px 0px rgba(0, 0, 0, 0.02);\\\\n`;\\\\n\\\\nconst HeaderFilter = styled.div`\\\\n width: 100%;\\\\n padding: 1rem;\\\\n`;\\\\n\\\\nconst FilterLayout = styled.div`\\\\n min-height: 50px;\\\\n max-height: 400px;\\\\n overflow-y: auto;\\\\n padding: 1rem 0;\\\\n`;\\\\n\\\\nconst FilterEntry = styled.div`\\\\n padding: 10px 5px;\\\\n font-size: 14px;\\\\n background-color: ${(props) => (props.selected ? \\\\\\\"#F5F6FE;\\\\\\\" : \\\\\\\"white\\\\\\\")};\\\\n border-left: ${(props) => (props.selected ? \\\\\\\"2px solid #626AD1\\\\\\\" : \\\\\\\"none\\\\\\\")};\\\\n cursor: pointer;\\\\n font-size: 20px;\\\\n\\\\n .dao-img {\\\\n width: 32px;\\\\n height: 32px;\\\\n border-radius: 50%;\\\\n }\\\\n\\\\n .dao-container {\\\\n display: flex;\\\\n justify-content: flex-start;\\\\n gap: 1rem;\\\\n }\\\\n\\\\n .text {\\\\n color: #666;\\\\n }\\\\n\\\\n .owner {\\\\n font-size: 12px;\\\\n }\\\\n\\\\n &:hover {\\\\n background-color: #f2f2f2;\\\\n }\\\\n`;\\\\n\\\\nconst [filteredDao, useFilteredDao] = useState(false);\\\\nconst [filteredStatus, useFilteredStatus] = useState(false);\\\\n\\\\nconst handleFilterDaoChange = () => {\\\\n if (e.target.value === \\\\\\\"all\\\\\\\") {\\\\n useFilteredDao(false);\\\\n } else {\\\\n useFilteredDao(e.target.value);\\\\n }\\\\n};\\\\n\\\\nconst handleFilterStatusChange = (e) => {\\\\n if (e.target.value === \\\\\\\"all\\\\\\\") {\\\\n useFilteredStatus(false);\\\\n } else {\\\\n useFilteredStatus(e.target.value);\\\\n }\\\\n};\\\\n\\\\nconst [preparedItems, setPreparedItems] = useState(items);\\\\n\\\\nconst statuses = [\\\\n { key: \\\\\\\"InReview\\\\\\\", value: \\\\\\\"In Review\\\\\\\" },\\\\n { key: \\\\\\\"New\\\\\\\", value: \\\\\\\"New\\\\\\\" },\\\\n { key: \\\\\\\"Approved\\\\\\\", value: \\\\\\\"Approved\\\\\\\" },\\\\n { key: \\\\\\\"Rejected\\\\\\\", value: \\\\\\\"Rejected\\\\\\\" },\\\\n { key: \\\\\\\"Closed\\\\\\\", value: \\\\\\\"Closed\\\\\\\" },\\\\n];\\\\n\\\\nsetPreparedItems(\\\\n items\\\\n .sort((a, b) => b.created_at - a.created_at)\\\\n .filter((item) => {\\\\n if (filteredDao) {\\\\n return item.dao_id === daos[filteredDao].id;\\\\n }\\\\n return item;\\\\n })\\\\n .filter((item) => {\\\\n if (filteredStatus) {\\\\n return item.status === statuses[filteredStatus].value;\\\\n }\\\\n return item;\\\\n })\\\\n);\\\\n\\\\nconst [showMobileFilter, setShowMobileFilter] = useState(false);\\\\nconst [showMobileDaoFilter, setShowMobileDaoFilter] = useState(false);\\\\nconst [showMobileStatusFilter, setShowMobileStatusFilter] = useState(false);\\\\n\\\\nconst handleMobileFilter = () => {\\\\n setShowMobileFilter(!showMobileFilter);\\\\n};\\\\n\\\\nif (!preparedItems) return <Widget src=\\\\\\\"flashui.near/widget/Loading\\\\\\\" />;\\\\n\\\\nreturn (\\\\n <>\\\\n <Table>\\\\n <TableHeader>\\\\n <TableHeaderCell>\\\\n <div className=\\\\\\\"d-flex justify-content-between\\\\\\\">\\\\n <div>Status</div>\\\\n {/* <Select value={filteredStatus} onChange={handleFilterStatusChange}>\\\\n <option value=\\\\\\\"all\\\\\\\">All</option>\\\\n {statuses.map((status, index) => (\\\\n <option key={index} value={status.key}>\\\\n {status.value}\\\\n </option>\\\\n ))}\\\\n </Select> */}\\\\n </div>\\\\n </TableHeaderCell>\\\\n <TableHeaderCell flex={3}>\\\\n <div className=\\\\\\\"d-flex justify-content-between\\\\\\\">\\\\n <div>DAO</div>\\\\n {/* <Select value={filteredDao} onChange={handleFilterDaoChange}>\\\\n <option value=\\\\\\\"all\\\\\\\">All</option>\\\\n {daos.map((dao, index) => (\\\\n <option key={index} value={dao.id}>\\\\n {dao.title}\\\\n </option>\\\\n ))}\\\\n </Select> */}\\\\n </div>\\\\n </TableHeaderCell>\\\\n <TableHeaderCell flex={2}> Modified </TableHeaderCell>\\\\n <TableHeaderCell flex={5.5}>Proposals states</TableHeaderCell>\\\\n <TableHeaderCell></TableHeaderCell>\\\\n <TableHeaderCell></TableHeaderCell>\\\\n </TableHeader>\\\\n\\\\n {preparedItems.length === 0 ? (\\\\n <div className=\\\\\\\"w-100 my-5 d-flex justify-content-center align-tems-center\\\\\\\">\\\\n <h1>No active Reports</h1>\\\\n </div>\\\\n ) : (\\\\n preparedItems.map((row, index) => (\\\\n <div key={row.title}>\\\\n <Widget\\\\n src=\\\\\\\"ndcdev.near/widget/daos.Components.Post\\\\\\\"\\\\n props={{ item: row, index, type, rowId: row.id }}\\\\n />\\\\n </div>\\\\n ))\\\\n )}\\\\n </Table>\\\\n\\\\n <Mobile>\\\\n <>\\\\n <MobileHeader>\\\\n <MobileTitle>All Proposals</MobileTitle>\\\\n <FilterButton onClick={handleMobileFilter}>\\\\n <i class=\\\\\\\"ph ph-funnel\\\\\\\"></i>\\\\n </FilterButton>\\\\n </MobileHeader>\\\\n {showMobileFilter ? (\\\\n <FiltersContainer>\\\\n <HeaderFilter className=\\\\\\\"d-flex justify-content-between\\\\\\\">\\\\n <MobileTitle>Filters</MobileTitle>\\\\n <MobileTitle\\\\n onClick={() => setShowMobileFilter(!showMobileFilter)}\\\\n >\\\\n <i class=\\\\\\\"ph ph-x\\\\\\\"></i>\\\\n </MobileTitle>\\\\n </HeaderFilter>\\\\n <HeaderFilter>\\\\n <div\\\\n onClick={() => setShowMobileDaoFilter(!showMobileDaoFilter)}\\\\n className=\\\\\\\"d-flex justify-content-between\\\\\\\"\\\\n >\\\\n <MobileTitle>DAO</MobileTitle>\\\\n {showMobileDaoFilter ? (\\\\n <i class=\\\\\\\"ph ph-caret-up\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph ph-caret-down\\\\\\\"></i>\\\\n )}\\\\n </div>\\\\n {showMobileDaoFilter && (\\\\n <FilterLayout>\\\\n {daos.map((dao, index) => (\\\\n <FilterEntry\\\\n key={index}\\\\n selected={index === filteredDao}\\\\n onClick={() => useFilteredDao(filteredDao === index ? false : index )}\\\\n >\\\\n <div className=\\\\\\\"dao-container\\\\\\\">\\\\n <img className=\\\\\\\"dao-img\\\\\\\" src={dao.logo_url} />\\\\n <div> {dao.title} </div>\\\\n </div>\\\\n </FilterEntry>\\\\n ))}\\\\n </FilterLayout>\\\\n )}\\\\n </HeaderFilter>\\\\n <HeaderFilter>\\\\n <div\\\\n onClick={() =>\\\\n setShowMobileStatusFilter(!showMobileStatusFilter)\\\\n }\\\\n className=\\\\\\\"d-flex justify-content-between\\\\\\\"\\\\n >\\\\n <MobileTitle>Status</MobileTitle>\\\\n {showMobileStatusFilter ? (\\\\n <i class=\\\\\\\"ph ph-caret-up\\\\\\\"></i>\\\\n ) : (\\\\n <i class=\\\\\\\"ph ph-caret-down\\\\\\\"></i>\\\\n )}\\\\n </div>\\\\n {showMobileStatusFilter && (\\\\n <FilterLayout>\\\\n {statuses.map((status, index) => (\\\\n <FilterEntry\\\\n key={index}\\\\n selected={index === filteredStatus}\\\\n onClick={() => useFilteredStatus( filteredStatus === index ? false : index )}\\\\n >\\\\n {status.value}\\\\n </FilterEntry>\\\\n ))}\\\\n </FilterLayout>\\\\n )}\\\\n </HeaderFilter>\\\\n </FiltersContainer>\\\\n ) : preparedItems.length === 0 ? (\\\\n <div className=\\\\\\\"w-100 my-5 d-flex justify-content-center align-tems-center\\\\\\\">\\\\n <h1>No active Reports</h1>\\\\n </div>\\\\n ) : (\\\\n preparedItems.map((row, index) => (\\\\n <div key={row.title}>\\\\n <Widget\\\\n src=\\\\\\\"ndcdev.near/widget/daos.Components.Post\\\\\\\"\\\\n props={{\\\\n item: row,\\\\n index,\\\\n type,\\\\n rowId: row.id,\\\\n isMobile: true,\\\\n }}\\\\n />\\\\n </div>\\\\n ))\\\\n )}\\\\n </>\\\\n </Mobile>\\\\n </>\\\\n);\\\\n" |