UII - /vapor/proposals?status=active - List of active proposals

[joticajulian]

Create a page to display active proposals. The proposals are paginated. Present up to 20 proposals per page. URL: http://localhost:3000/vapor/proposals?status=active

The smart contract is not yet deployed, but for the moment define something like this in the code and comment it:

/*
const { result: activeProposals } = await contract.functions.get_active_proposals({
  start: 0, // first page
  limit: 20, // proposals per page
  direction: 0,
});
*/

Use the following dummy data as the response of the call:

const activeProposals = [
  {
    id: 12,
    title: "Marketing campaign in Twitter and Youtube 🚀" ,
    summary: "Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos.",
    url: "https://koinos.io",
    monthly_payment: "100000000000", // 1000 koin
    starting_date: "1698796800000", // 2023-11-01
    ending_date: "1730419200000", // 2024-11-01
    beneficiary: "1B2Us2ynMLjCEGNJEewTXSzymQSQSeDUer",
    date_last_payment: "0", // no last payment,
    total_paid: "0",
    vapor: "500000000000", // 5000 vapor
    contributors: 12,
    total_shares: "500000000000",
  }, {
    id: 17,
    title: "Ledger hardware wallet support 🔐" ,
    summary: "Develop the interface to interact with Ledger in order to support hardware wallets in Koinos.",
    url: "https://medium.com/ledger/ledger-hardware-wallet-support-koinos-blockchain",
    monthly_payment: "100000000000", // 1000 koin
    starting_date: "1688169600000", // 2023-07-01
    ending_date: "1730419200000", // 2024-11-01
    beneficiary: "1B2Us2ynMLjCEGNJEewTXSzymQSQSeDUer",
    date_last_payment: "1698796800000", // 2023-11-01
    total_paid: "500000000000", // 5000 koin
    vapor: "7200000000000", // 72000 vapor
    contributors: 33,
    total_shares: "7200000000000",
  }, {
    id: 18,
    title: "Apply security patch in the Koin contract" ,
    summary: "Apply a security patch in the Koin contract. Apply a security patch in the Koin contract.Apply a security patch in the Koin contract.Apply a security patch in the Koin contract.Apply a security patch in the Koin contract.Apply a security patch in the Koin contract.Apply a security patch in the Koin contract.",
    url: "https://medium.com/security/apply-security-patch-in-the-koin-contract-123kekro456",
    monthly_payment: "120000000000", // 1200 koin
    starting_date: "1688169600000", // 2023-07-01
    ending_date: "1730419200000", // 2024-11-01
    beneficiary: "1B2Us2ynMLjCEGNJEewTXSzymQSQSeDUer",
    date_last_payment: "1698796800000", // 2023-11-01
    total_paid: "500000000000", // 5000 koin
    vapor: "7200000000000", // 72000 vapor
    contributors: 33,
    total_shares: "7200000000000",
  },
]

Do not display the VAPOR support. Instead of that, convert VAPOR into KOIN for a better readability: koin = (Number(proposal.vapor)/6e8).toString() + " KOIN".

For each proposal display how many months are covered with the current funding.

Add a button (or link) on each proposal to redirect the user to http://localhost:3000/vapor/proposals/{proposal_id}

At the top of the page add a link to the upcoming proposals: http://localhost:3000/vapor/proposals?status=upcoming

Reference page to copy things related to koilib, env vars, header, etc: https://github.com/joticajulian/kondor-website/blob/main/website/src/views/nicknames/index.vue

BONUS: Load nicknames contract and call nicknames.functions.get_main_token({ account: "1MdqwaSBy6rbasPJ9vmg2pZFJSVZ29GFpZ" }) to get the nickname of the benefiary. If the nickname exists display it instead of the benefiary address.

[frank-weijers]

Updated response:

const activeProposals = [
  {
    id: 12,
    title: "Marketing campaign in Twitter and Youtube 🚀" ,
    summary: "Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos. Contact with influencers in twitter and youtube to show the advantages of koinos.",
    url: "https://koinos.io",
    payment_token: "koin", // Name of whitelisted token to receive payments in = KOIN
    payment_amount: "100000000000", // 1000 koin
    payment_interval: "monthly",
    starts_at: "1698796800000", // 2023-11-01
    ends_at: "1730419200000", // 2024-11-01
    beneficiary: "1B2Us2ynMLjCEGNJEewTXSzymQSQSeDUer",
    last_paid_at: "0", // no last payment,
    total_paid: "0",
    contributor_count: 12,
    allocated_amount: "500000000000", // 5000 vapor
    total_shares: "500000000000",
    fee: "2000000000", // 20 koin
  }
];