import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { AviLinkLarge } from "../../Components/AviLink";
import { BulkActionModal } from "../../Components/Modals/BulkActionModal";
import { Burger } from "../../../../Components/Icons/Burger";
import { Button, Col, Row } from "antd";
import { Dropdown, Menu } from "antd-latest";
import { Link, useParams } from "react-router-dom";
import { LoadMore } from "../../../../Components/LoadMore";
import { MemberCard } from "../../Components/Previews/Member/Card/MemberCard";
import { NoBulkActionModal } from "../../Components/Modals/NoBulkActionModal";
import { ProposalCard } from "../../Components/Previews/Standard/Card/ProposalCard";
import { ProposalRow } from "../../Components/Previews/Standard/Row/ProposalRow";
import { UserStake } from "../../../../Components/UserWidget";
import { WhitelistCard } from "../../Components/Previews/Whitelist/Card/WhitelistCard";
import { WhitelistProposalRow } from "../../Components/Previews/Whitelist/Row/WhitelistProposalRow";
import { convertDaoProposalsForUI } from "../../Utils/Helpers";
import { defaultDao } from "../../Utils/defaultDao";
import { useActions, useAppState } from "../../../../overmind";
import { useCachedDaoProposals, useCachedDaoWhitelist, useCachedDaoWhitelistProposals, useCachedPool, useCachedUser, } from "../../../../hooks/useCached";
import { useState } from "react";
import ArrowDown from "../../../../Components/Icons/ArrowDown";
import ListToggle from "../../../../Components/Icons/ListToggle";
import MemberRow from "../../Components/Previews/Member/Row/MemberRow";
export const ProposalsPage = () => {
    const { daoOwner } = useParams();
    return _jsx(Proposals, { daoOwner: daoOwner });
};
export const Proposals = (props) => {
    const state = useAppState();
    const actions = useActions();
    const currUser = state.api.auth.user?.username || "";
    // crude fix below, refactor
    const daoOwner = props.daoOwner && props.daoOwner !== "proposals" ? props.daoOwner : defaultDao(state); //state.config.settings.newcoin.daoDomain;
    const ownDao = state.api.auth.user?.username === daoOwner;
    const daoProposals = useCachedDaoProposals({ daoOwner });
    const daoWhitelistProposals = useCachedDaoWhitelistProposals({ daoOwner });
    const daoMembers = useCachedDaoWhitelist({ daoOwner });
    const daoOwnerObj = useCachedUser({ username: daoOwner });
    const pool = useCachedPool({ owner: daoOwner });
    const myPools = state.newcoin.pools || {};
    const stakedAmt = myPools[pool.code];
    const [toggleView, setToggleView] = useState(false);
    const [showProposalType, setShowProposalType] = useState("standard");
    const [bulkAction, setBulkAction] = useState({ state: false, action: "" });
    const [sortSelection, setSortSelection] = useState("all");
    let proposals;
    const proposalTypes = {
        standard: convertDaoProposalsForUI(daoProposals.rows),
        whitelist: convertDaoProposalsForUI(daoWhitelistProposals.rows),
    };
    if (showProposalType == "members")
        proposals = daoMembers.rows;
    else if (sortSelection == "all")
        proposals = proposalTypes[showProposalType];
    else {
        proposals = proposalTypes[showProposalType].filter((row) => {
            if (sortSelection == "byMe")
                return row.proposer == currUser;
            if (sortSelection == "byOthers")
                return row.proposer != currUser;
            if (sortSelection == "expired")
                return row.time_data.time_left_seconds < 0;
            if (sortSelection == "needsApproval")
                return row.status == "created" && row.proposer == currUser;
            if (sortSelection == "needsExecution")
                return row.status == "approved" && row.time_data.time_left_seconds < 0 && row.proposer == currUser;
            if (sortSelection == "needsVoting")
                return row.status == "approved" && row.time_data.time_left_seconds > 0;
        });
    }
    const menu = (_jsx(Menu, { items: [
            {
                key: "1",
                label: _jsx("p", { onClick: () => setSortSelection("needsApproval"), children: "Needs Approval" }),
            },
            {
                key: "2",
                label: _jsx("p", { onClick: () => setSortSelection("needsVoting"), children: "Needs Votes" }),
            },
            {
                key: "3",
                label: _jsx("p", { onClick: () => setSortSelection("needsExecution"), children: "Needs Execution" }),
            },
            {
                key: "4",
                label: _jsx("p", { onClick: () => setSortSelection("expired"), children: "Expired" }),
            },
            {
                key: "5",
                label: _jsx("p", { onClick: () => setSortSelection("all"), children: "See All" }),
            },
            {
                key: "6",
                label: _jsx("p", { onClick: () => setSortSelection("byMe"), children: "By Me" }),
            },
            {
                key: "7",
                label: _jsx("p", { onClick: () => setSortSelection("byOthers"), children: "By Others" }),
            },
        ] }));
    const menu2 = (_jsx(Menu, { items: [
            {
                key: "1",
                label: (_jsx("p", { onClick: () => {
                        const s = proposals.filter((row) => row.status == "created" && row.proposer == currUser);
                        if (s.length > 0) {
                            setSortSelection("needsApproval");
                            setBulkAction({ state: true, action: "approve" });
                        }
                        else
                            setBulkAction({ state: "none", action: "approve" });
                    }, children: "Approve All" })),
            },
            {
                key: "2",
                label: (_jsx("p", { onClick: () => {
                        const s = proposals.filter((row) => row.status == "approved" && row.time_data.time_left_seconds < 0 && row.proposer == currUser);
                        if (s.length > 0) {
                            setSortSelection("needsExecution");
                            setBulkAction({ state: true, action: "execute" });
                        }
                        else
                            setBulkAction({ state: "none", action: "execute" });
                    }, children: "Execute All" })),
            },
        ] }));
    let proposalsState;
    showProposalType == "whitelist" && (proposalsState = (state.newcoin.daos[daoOwner] || {})["whitelistProposals"] || {});
    showProposalType == "standard" && (proposalsState = (state.newcoin.daos[daoOwner] || {})["standardProposals"] || {});
    showProposalType == "members" && (proposalsState = (state.newcoin.daos[daoOwner] || {})["memberProposals"] || {});
    let inProgress;
    showProposalType == "whitelist" && (inProgress = !!state.indicators.specific[`newcoin.daoGetWhitelistProposals`]);
    showProposalType == "standard" && (inProgress = !!state.indicators.specific[`newcoin.daoGetProposals`]);
    showProposalType == "members" && (inProgress = !!state.indicators.specific[`newcoin.daoGetWhitelist`]);
    const shouldLoadMore = !inProgress && (!proposalsState || proposalsState?.more);
    const loadMore = () => {
        showProposalType == "whitelist" && actions.newcoin.daoGetWhitelistProposals({ daoOwner });
        showProposalType == "standard" && actions.newcoin.daoGetProposals({ daoOwner });
        showProposalType == "members" && actions.newcoin.daoGetWhitelist({ daoOwner });
    };
    if (!inProgress && !daoProposals.dao_id && !ownDao) {
        return window.location.pathname === "/dao/create" ? null : (_jsxs("div", { className: "dao-not-found", children: [_jsx("h1", { children: "Can't find anything!" }), _jsx("p", { children: "Try to search with another name." })] }));
    }
    return (_jsxs(Col, { children: [_jsxs("div", { className: "dao-details-ctn", children: [_jsx(AviLinkLarge, { showVerified: false, wrapperClass: "avi", username: daoOwner, userObj: daoOwnerObj }), _jsxs("div", { className: "dao-details-txt", children: [_jsx("p", { className: "header-1r", children: " DAO" }), _jsxs("p", { className: "paragraph-2b", children: [Math.round(stakedAmt), " $", pool.code, " Staked"] })] }), _jsxs("div", { className: "dao-details-btns", children: [_jsx(UserStake, { buttonText: `Get $${pool.code}`, user: { username: daoOwner }, hideButton: false }), _jsx(Button, { className: "power-up-btn", children: _jsx(Link, { to: `/dao/${daoOwner}/new-proposal`, children: "New Proposal" }) })] })] }), _jsxs("div", { className: "dao-tabs-ctn", children: [_jsxs("h2", { className: `menu-h2-${showProposalType == "standard" ? "active" : "inactive"}`, onClick: () => setShowProposalType("standard"), children: [" ", "Proposals"] }), _jsxs("h2", { className: `menu-h2-${showProposalType == "whitelist" ? "active" : "inactive"}`, onClick: () => setShowProposalType("whitelist"), children: [" ", "Member Proposals"] }), _jsxs("h2", { className: `menu-h2-${showProposalType == "members" ? "active" : "inactive"}`, onClick: () => setShowProposalType("members"), children: [" ", "Members"] }), ownDao && (_jsxs(Row, { children: [_jsx(Dropdown, { overlay: menu2, children: _jsx("a", { onClick: (e) => e.preventDefault(), children: _jsxs(Row, { className: "menu-h2-inactive u-gap-15", align: "middle", children: ["Multi Select", _jsx(ArrowDown, {})] }) }) }), bulkAction.state === true && (_jsx(BulkActionModal, { proposals: proposals, showProposalType: showProposalType, daoId: daoProposals.dao_id, actionType: bulkAction.action, dao_owner: daoOwner })), bulkAction.state === "none" && _jsx(NoBulkActionModal, {})] })), _jsx(Dropdown, { overlay: menu, children: _jsx("a", { onClick: (e) => e.preventDefault(), children: _jsxs(Row, { className: "menu-h2-inactive u-gap-15", align: "middle", children: ["Sort By", _jsx(ArrowDown, {})] }) }) }), _jsx(Row, { className: "sort", align: "middle", onClick: () => setToggleView(!toggleView), children: toggleView ? _jsx(Burger, {}) : _jsx(ListToggle, {}) })] }), _jsxs(Row, { className: "toggle-wrapper", children: [showProposalType == "standard" &&
                        proposals
                            .reverse()
                            .map((proposal) => !toggleView ? (_jsx(ProposalRow, { daoOwner: daoOwner, proposal: proposal, proposalId: proposal.id, wrapperClass: "row-wrapper", buttonType: "view" })) : (_jsx(ProposalCard, { daoOwner: daoOwner, proposal: proposal }))), showProposalType == "whitelist" &&
                        proposals
                            .reverse()
                            .map((proposal) => !toggleView ? (_jsx(WhitelistProposalRow, { daoOwner: daoOwner, proposal: proposal, proposalId: proposal.id, wrapperClass: "row-wrapper", buttonType: "view" })) : (_jsx(WhitelistCard, { daoOwner: daoOwner, proposal: proposal }))), showProposalType == "members" &&
                        proposals.map((member) => !toggleView ? (_jsx(MemberRow, { user: member.user, daoId: daoProposals.dao_id, ticker: pool.code })) : (_jsx(MemberCard, { user: member.user, daoId: daoProposals.dao_id, ticker: pool.code }))), shouldLoadMore && _jsx(LoadMore, { loadMore: loadMore })] })] }));
};
export default Proposals;
//# sourceMappingURL=ProposalList.js.map