Campaign. Create “Organization/Campaigns” page

[EDzidziguri]

Statement of Value

As a creator
I want to create a campaign
So that I will be able to raise funds

———

Acceptance Criteria

Open "My Campaigns" page
1 When a user clicks the "Campaigns" section on the "Organisation" page (see Pic.1), then open the “Organization/Campaigns” page (see Pic.3) in the current browser tab with the following UI elements:

Header
1.1. Organization image (see Pic.3 (1)). The current functionality must remain.
1.2. Organization avatar (see Pic.3 (2)). The current functionality must remain.
1.3. The name of the organization (see Pic.3 (3)). The current functionality must remain.
1.4. A number of members in the organization (see Pic.3 (4)). The current functionality must remain.

Navigation menu
1.5. "Overview" link (see Pic.3 (5)).
1.5.1. The current functionality must remain. Example.
1.6. "Campaigns" link (see Pic.3 (6)).
1.6.1. Active by default.
1.7. "Proposals" link (see Pic.3 (7)).
1.7.1. The current functionality must remain. Example.
1.8. "Members" link (see Pic.3 (8)).
1.8.1. The current functionality must remain. Example.
1.9. "Treasury" link (see Pic.3 (9)).
1.9.1. The current functionality must remain. Example.
1.10. "Settings" link (see Pic.3 (10)).
1.10.1. The current functionality must remain. Example.

"New Campaign" button
1.11. "New Campaign" button (see Pic.3 (11)).
1.11.1. The "New Campaign" button (see Pic.3 (11)) must always be displayed as a first card in the list of campaigns.
1.11.2. The whole area of the button must be clickable.
1.11.3. A hover state must be used.
1.11.4. Must be displayed for the organization owner only.

List of campaigns
1.12. Campaign related to an organization (see Pic.3 (12)). Clickable. Will lead to the "Campaign details" page, which will be specified in another user story.
1.12.1. Campaigns must be ordered in the following way:
Refer to status table here #230
• Active campaigns must be displayed at the top (StatusID: 1)
• Init campaigns must be displayed next (StatusID: 0)
• Finalizing campaigns must be displayed next (StatusID: 3)
• Success campaigns must be displayed next (StatusID: 5)
• Reverting campaigns must be displayed next (StatusID: 4)
• Failed campaigns must be displayed next (StatusID: 6)
• Paused campaigns must be displayed next (StatusID: 2)
• Locked campaigns must be displayed next (StatusID: 7)
1.12.2. Active and Completed campaigns must be ordered by the "End date" (display the one that will be ended soon at the top).

"Campaign" card
Images
1.13. Campaing image (see Pic.3 (13)).
1.14. Organization avatar (see Pic.3 (2)). The current functionality must remain.

Titles
1.15. Campaign title (see Pic.3 (15)).
1.15.1. If the campaign title exceeds 50% of the card width on desktop, then cut it off with ellipsis (e.g. "Lorem imps...).
1.16. The name of the organization (see Pic.3 (16)).
1.16.1. If the organization title exceeds 50% of the card width on desktop, then cut it off with ellipsis (e.g. "Lorem imps...).
1.16.2. The name must be displayed in the following format: "By X", where "X" is the name of the organization.

Progress bar
1.17. Progress bar (see Pic.3 (17)).
1.17.1. Depicts the current progress of a campaign from 0 amount to target amount (see Pic.3 (21)).
1.17.2. aUSD currency must be used for tracking the progress.
1.17.3. When the progress is updated while the "My Campaigns" page (see Pic.2) is opened, then do not update the progress bar until a user reloads the page.

Funded amount
1.18. "Funded" label (see Pic.3 (18)).
1.19. Funded amount (see Pic.3 (19)).
1.19.1. aUSD currency must be used.
1.19.2. The amount must be displayed in the following format:
• Without abbreviation and decimals (e.g. "120") - if the amount is from 0 to 999
• With a "k" abbreviation, and with comma between a thousands and hundreds, and with one number after a comma, and without decimals (e.g. "1,2k") - if the amount is from 1,000 to 999,999
• With an "m" abbreviation, and with comma between a millions and thousands, and with one number after a comma, and without decimals (e.g. "1,2m") - if the amount is from 1,000,000 to 999,999,999
• With a "b" abbreviation, and with comma between a billions and millions, and with one number after a comma, and without cents (e.g. "1,2b") - if the amount is from 1,000,000,000 to 999,999,999,999

Target amount
1.20. "Target" label (see Pic.3 (20)).
1.21. Target amount (see Pic.3 (21)).
1.21.1. aUSD currency must be used.
1.21.2. The amount must be displayed in the following format:
• Without abbreviation and decimals (e.g. "120") - if the amount is from 0 to 999
• With a "k" abbreviation, and with comma between a thousands and hundreds, and with one number after a comma, and without decimals (e.g. "1,2k") - if the amount is from 1,000 to 999,999
• With an "m" abbreviation, and with comma between a millions and thousands, and with one number after a comma, and without decimals (e.g. "1,2m") - if the amount is from 1,000,000 to 999,999,999
• With a "b" abbreviation, and with comma between a billions and millions, and with one number after a comma, and without cents (e.g. "1,2b") - if the amount is from 1,000,000,000 to 999,999,999,999

Contributors
1.22. "Contributors" label (see Pic.3 (22)).
1.23. Number of contributors in a campaign (see Pic.3 (23)).
1.23.1. The number must be displayed in the following format:
• Without abbreviation (e.g. "120") - if the number is from 0 to 999
• With a "k" abbreviation, and with comma between a thousands and hundreds, and with one number after a comma (e.g. "1,2k") - if the number is from 1,000 to 999,999
• With an "m" abbreviation, and with comma between a millions and thousands, and with one number after a comma (e.g. "1,2m") - if the number is from 1,000,000 to 999,999,999
• With a "b" abbreviation, and with comma between a billions and millions, and with one number after a comma (e.g. "1,2b") - if the number is from 1,000,000,000 to 999,999,999,999

Localisation
2. It should be possible to localise all text fragments indicated in the current user story.

———

Additional Information

Environment
The functionality specified in this user story must be implemented for the Haiku product - https://haiku.gamedao.co/.

Design
• "My account" dropdown (desktop)
• "My campaigns" page (desktop)

Images

_Picture 1. "Campaigns" section_

Picture 3. List of UI elements on the “Organization/Campaigns” page