gamedaoco / gamedao-haiku Goto Github PK

Describe the bug
Layout all over the place

To Reproduce
Steps to reproduce the behavior:

1. Go to internetz

Expected behavior

• footer should render below sidebar and content area
• sidebar should have min height 100vh-topbar height

Screenshots

@5-mark

User Story

As user I want to see organisations on a list page so I can find organisations I am interested in.

Acceptance Criteria

1. the page /app/organisations results in a list page with organisations listed in organisation cards
2. each card represents an organisation (body) and has following elements:
   2.1 Logo
   2.2 member count with icon
   2.3 open, invitation or application label with icon
   2.3 description which is cut after 2 lines of description and followed by "..."
   2.4. membership states: when wallet is connected and the user is member, the user can see a "joined" label
3. On click of the organisation card the user gets to the Organisation Detail page (see beta for reference)
4. Org List Page is sorted by creation date (oldest on top)
5. org card highlights when hovering
6. mouse pointe changes to hand when hovering

Additional Information

Figma Link:

• https://www.figma.com/file/5L4VE8EIhRVB6kfIB50zlT/Minimal-Web?node-id=1329%3A102485
• https://www.figma.com/file/5L4VE8EIhRVB6kfIB50zlT/Minimal-Web?node-id=1329%3A102428
  ℹ️ please consider where "subscriptions" make sense on the organisation card (eg. member?)

How to test

1. call /app/organisations
2. go through all ACs
3. click on a dao card and get to the detail page (can be empty for now)

User Story

As GameDAO user I want to see my wallet connect status in the top navigation including links so I can access/see them from anywhere of the page easily.

Acceptance Criteria

Mobile

1. The top navigation shows the wallet connect option [#69]
   1.1. If user is not connected, a button is shown which triggers the wallet connect [#44]
   1.2. If connected the button turn into an avatar
   1.2.1 if the onchain identity email is set and a gravatar image exists for the email the gravatar is shown
   1.2.2 if not a fallback image is set (see figma)
   1.3. Clicking the avatar triggers the wallet flyout

Desktop

2. The top navigation shows the wallet connect option [#69]
   2.1. If user is not connected, a button is shown which triggers the wallet connect [#44]
   2.2. If connected the button turn into the connected button state showing following information:
   2.2.1 The avatar is shown on the left
   2.2.2 In the middle the account name and account hash are shown
   2.2.3 If account is verified, a verified icon is shown in front of the hash
   2.2.4 If account is not verified, no icon is shown
   2.2.5 on the right an dropdown button is shown which triggers the wallet flyout

Mobile + Desktop

3. Both mobile and desktop show a flyout which includes following elements
   3.1. The connected wallet is shown as a card including the avatar, name, verification icon and hash
   3.2. the connected wallet can be changed by clicking the change button on the card
   3.3. Clicking the wallet change button closes the flyout and triggers a modal box listing all available wallets
   3.4. A box with your transferable balances are shown corresponding to the selected network
   3.5. An account navigation is shown linking to the dashboard and various subpages of the account page
   3.6. At the bottom the currently selected network is shown
   3.7. Clicking on the network or the 3 dots closes the flyout and triggers a modal box listing all available networks

Additional Information

UI Mockups: https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A17
Design: https://www.figma.com/file/5L4VE8EIhRVB6kfIB50zlT/Minimal-Web?node-id=1489%3A112412

How to test

1. a
2. b
3. c
4. d

User Story

As frontend engineer I want to make use of a GraphQL backend to expose chain data and other data to my frontend.

Acceptance Criteria

1. Setup GraphQL server
2. write schema according our needs
   2.1 define data for all objects on the chain as GraphQL Type
3. pull ZERO chain data from Subsquid GraphQL Server
4. create endpoints on haiku GraphQL server to pull data

Additional Information

How to test

1. check if APIs on haiku GraphQL deliver right data

User Story

As user I want to view my account so I can inform myself and take care about my account related data.

Acceptance Criteria

1. view my network wallet balances in detail (transferrable, locked, reserved etc)
2. view & claim onchain identity
3. view & claim KYC (no objective for AA cycle, do ideation about visualising KYC status, keep static)
4. view achievements (no objective for AA cycle, do ideation about visualising achievements, keep static)
5. view collectibles (including information about the collectible)
6. view participations (eg. funded campaigns etc.)
7. view update log (do ideation about: notifications, starting/ending campaigns, rewards to be claimed etc.)
8. view transaction log (all transactions made on GameDAO including descriptive information)

Additional Information

• please add more topics if you see more or reassign topics which you think are not related to account
• all points do not represent account menu items, maybe some of the points can be merged behind one menu item.

Links to wireframes:

Link to figma with wireframes and navigation proposal

• anchor links to stay on page & full page for settings

• descriptions can be found on file
  https://www.figma.com/file/NQ2MpTJlQ1fwWhSZ5hsHCx/Wireframe-%26-Sketches?node-id=135%3A16872

• added proposals to the dashboard
  please review @5-mark @mikeplanzer
  andre

User Story

As gamedao platform managerI want activate/deactivate features and components without deploying the backend so I can react on external factors.

Acceptance Criteria

1. frontend components shall be enableable (eg. search bar)
2. frontend features shall be enableable (payment with ramp)
3. chain features shall be shall be enableable (eg. governance protocol, create organisation)
4. when a configuration is activated no backend deployment is necessary

Additional Information

How to test

1. de-/activate a frontend component and see them in-/active in the frontend
2. de-/activate a frontend feature and see them in-/active in the frontend
3. de-/activate protocoll features onchain and see them in-/active in the frontend

User Story

As developer I want to be sure the application works by automated e2e testing.
data-id attributes need to be added to inputs etc.

How to test

run yarn e2e and see testing output

User Story

As developer I want to onboard quick on haiku so that I understand the repo and can start developing quick.

Acceptance Criteria

1. write onboarding readme for haiku

Additional Information

How to test

1. any new developer can start working after reading the readme and following all steps there.

Better non blocking?
<script async type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js" />

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Additional context
Add any other context about the problem here (eg. device/browser)

User Story

As gameDAO manager I want to ensure that the frontend can consume data from different chains and chain versions so that I can rely on a resilient and operational platform.

Acceptance Criteria

1. GraphQL handles types from different chain versions (eg. zero old version and new version with pallets based on substrate V3)

Additional Information

• consider GraphQL update
• consider Frontend update
• try to autogenerate as much as possible
• @Persqual, @vasylenko-yevhen, @2075 could you refine the ticket better so we get a read-2-develop ticket?

How to test

1. a
2. b
3. c
4. d

https://github.com/coinbase/rosetta-specifications
https://github.com/docknetwork/rosetta-api

User Story

As user I want to find organisations on the organisations page by searching for their names so I can find the organisations I am interested in.

Acceptance Criteria

PoC: Example find organisation

1. A search input field is shown at the top of the org. list page
2. As soon as you start to type within the input field, the card on the list page are updated based on your search term: Example: https://j0y9w.csb.app/
   2.1 Organizations found: Based on your term, organisations are shown.
   2.1.1. The search term is highlighted with the resulting organization title
   2.2 Nothing found: In case there is no organization found, it shows a "not found" text within the flyout below the search field
   3. Clicking on an organisation within the search flyout - redirects to the corresponding org.
3. enable / disable feature via feature toggles

Design

https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A18

Additional Information

• part of EPIC: #86

How to test

1. test the activation and deactivation of the search bar component
2. enter a search term which does not exist in the available organisations and see the nothing found view
3. enter a search term which exists multiple times and see all corresponding organisations listed
4. click one of them and get redirected to the corresponding organisation detail page

User Story

As GameDAO user I want to see most interesting links on the top navigation so I can access them from anywhere of the page easily.

Acceptance Criteria

Mobile

1. Shows top bar navigation which is sticky on scroll
   1.1 On the left there are 3 dots which open the organisations sidebar [#70]
   1.2 In the middle the logo is shown
   1.3 The logo is linked to the app root url
   1.4 On the right the wallet and burger navigation are shown

2. Wallet [#78]
   2.1 When not connected there is a button shown
   2.2 When connected the button turns into an avatar
   2.3 Clicking on the avatar opens a the wallet flyout [#78]

3. Burger Navigation
   3.1 Clicking on burger navigation opens side-panel from right to left
   3.2. Navigation items are listed as follows
   3.2.1. Link Organisations List Page with "Organisations" to "/app/organisations"
   3.2.2. Link Campaigns List Page with "Campaigns" to "/app/campaigns"
   3.3.3. Link "Quests" to "/app/quests"
   3.3. At the bottom a helper text + button to the documentation is shown
   3.4. Social media icons are shown at the very bottom linking to the corresponding plattforms

4. Search bar not to be included yet

Additional Information

• part of EPIC: #68

UI Mockups: https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A17
Design System: https://www.figma.com/file/5L4VE8EIhRVB6kfIB50zlT/Minimal-Web?node-id=1489%3A112412

How to test

1. a
2. b
3. c
4. d

User Story

As #user I want to see a proper preview image when I share links of gamedao so my post looks nice

Acceptance Criteria

1. integrate open graph tags for twitter and facebook
2. title: "GameDAO is a community owned cooperative providing fundraising, coordination and ownership protocols for the videogames economy."
3. description: "GameDAO - boot create play trade"
4. image: "https://ipfs.gamedao.co/gateway/QmZxXCMLpqHT9Bz8nsTiZau1tKHeqFvucF9Pp99gYDsfq4"
5. locale: "en_GB"
6. url: current url
7. type: website

Additional Information

How to test

1. post a link from gamedao on twitter
2. see proper content on post
3. c
4. d

User Story

As a DAO member I want to navigate though relevant pages in context of the respective DAO.

Acceptance Criteria

1. the context navigation is below the main teaser on mobile and desktop
2. Following links are available in the org navigation:

• Overview (links to Organisation Dashboard)
• Proposals (links to proposal page listing org-related proposals)
• Campaigns (links to a campaign overview page listing org-related campaigns)
• Treasury (links to a treasury overview page listing organisation assets)
• Members (links to members page listing member accounts indicating identities)
• Settings (links to the org-related settings page)

3. each subpage loads when clicking the nav point

Additional Information

How to test

1. a
2. b
3. c
4. d

User Story

As developer I want to integrate a frontend validation framework so I can easily display messages to the user to help him solve his problem.

Acceptance Criteria

• find suitable next.js / MUI5 compatible and easy to use validation framework
• framework needs to be able to handle i18n (eg. "minimum funding amount is xx$")
• framework needs to be extendable to interpret error codes from the corresponding chain, either directly from the chain, and/or from GraphQL
• error messages need to be maintainable through a i18n translation files also considering variables

Additional Information

How to test

1. a
2. b
3. c
4. d

User Story

As user I want to connect my wallet with gamedao so I can interact with the app

Acceptance Criteria

1. The connect button contains "connect wallet"
2. Clicking the button leads to a modal:
   2.1. If no polkadot.js or talisman wallet is installed the modal title says "No wallet found" and a list of wallets appear which can be installed (see Screenshot 1)
   2.2. The listed wallets link to the corresponding pages (see links in Additional Information)
3. If at least one wallet is installed the same modal appears with the title "Select wallet" (see Screenshot 2)
   3.1. The installed wallets are linking to connect the wallet
   3.2 The not installed wallets are linking to the corresponding wallets (see links in Additional information)
4. external links always open in a new tab
5. when the users wallet is connected the modal closes and the connect button is replaced by the wallet component

Additional Information

Screenshots are to be understood as example and not as final designs

Screenshot 1:

Screenshot 2:

Screenshot 3 (when both wallets installed):

Screenshot 4 (illustration how iconography could look like):

Wallet Links

Link Polkadot.js wallet: https://polkadot.js.org/extension/
Link Talisman wallet: https://talisman.xyz/
We do not link directly to the corresponding extension store of the browser, so that we dont have to update links if they change in the future.

###Process View

How to test

1. have no wallet installed (eg. inkognito tab) and click connect button
2. run through 2.1 & 2.2
3. have polkadot.js installed
4. run through 3, 3.1, 3.2
5. check all links (also if the open in new tab)
6. when connected see modal closing and wallet component

Link to UI in Figma

https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A15

User Story

As frontend developer I want to query all chain information through a graphql api so I can use information into the frontend easily, gain performance and separate frontend from backend. To achieve this the creation of various graphql endpoints is reasonable, to keep building blocks small, maintainable and scalable:

Acceptance Criteria

1. move all frontend related files into haiku repository
2. "clean up" folder structure
3. implement graphql endpoints api in nextjs
4. refactor chain queries/subscriptions with graphql queries/subscriptions

Additional Information

• PR for GraphQL integration: #24

How to test

1. chain information on haiku.gamedao.co are provided by GraphQL queries
2. no chain information left in frontend files which was directly called from the blockchain

User Story

As user I want to understand what my transaction is for, how much it costs and if it was successful or not so I am always in control of my funds.

Acceptance Criteria

1. have a modal which pops up when I want to perform a transaction
2. modal consists of
   2.1 a TITLE which describes what action I do (see additional information for different actions)
   2.2 subtitle "Transaction overview"
   2.3 "Your current balance" in network token
   2.4 Transaction fee
3. If the action contains a deposit of utility token (GAME) or stable coin (eg. aUSD):
   3.1 a 2nd ACTION SUBTITLE describing the sub-action (see additional information for different sub-actions)
   3.2 a linked hint "What is this used for" --> when clicking an info text shows up providing more information
   3.2 "Your current balance" in corresponding action token (GAME/aUSD)
   3.3 ACTION SUBLINE
4. Submit button
   4.1 When clicking the submit button the snack bar appears with loading icon (circling)
   4.2 additionally the wallet appears to sign the transaction
   4.3 when transaction is signed and was successful the success snackbar appears including the trx hash
   4.4 when the transaction failed the error snackbar appears including the error message the network provides
5. A "Get Zero/GAME or aUSD here" text (depending on the action either GAME or aUSD - always ZERO)
   5.1 links to discord faucet as long as we dont have a live liquidity pool
6. all texts are localized

Additional Information

• Figma Link: https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/GameDAO-Haiku-UI?node-id=1992%3A63862

screenshots

How to test

1. create transaction which might fail
2. see loading message & see error notification
3. create transaction which may succeed
4. see loading message & success notification
5. create trx with deposit and see deposit listed as designed in figma

Context

Extend GraphQL API

The GraphQL API needs ongoing development to have a unified codebase. This is an overarching epic collecting tasks which need to be addressed on the route to full GraphQL integration.

Tasks

• Remove REST Endpoints if an implementation as plain GraphQL resolver makes sense, which is not always the case, especially for external REST data sources (#41)
• Refactor API core, types and resolvers to a dedicated monorepo package to reduce implementation logic in frontend app. (#41)
• Automatically generate type definitions for networks we are connecting to ( zero, acala )

Additional Information + Findings

For type generation and also resolvers, validations etc.:

• This package looks neat and it's supported by the community: https://github.com/MichalLytek/type-graphql
• We have to add decorators etc. to our GraphQl interfaces/types and it can generate the schema for you.
• It also delivers a lot of nice-to-have things like clean splitted-up resolvers in classes, DI, Validations.

Context

As user I want to browse GameDAO so I can navigate effectively through all available objects and do not get lost.

Tasks

[#69] top navigation in place with all necessary links and mobile usable
[#70] Organisation quick access bar representing all possible behaviors including mobile solution
[#78] Wallet flyout

Additional Information

The general navigation concept should enable users to interact within their organisations and also to use the app as a product discovery platform.

Context

As user I want to use a DAO or campaign specific chat so I can interact with the community.

Tasks

Additional Information

User Story

As frontend developer I want to query all chain information through a graphql api so I can use information into the frontend easily, gain performance and separate frontend from backend.

Acceptance Criteria

1. A GraphQL indexer is implemented which can index blockchain data from any Polkadot chain (eg. ZERO, Acala) or other GraphQL indexes and REST apis (eg. Subsquid)
2. chain data should be saved and exposed to own (haiku) GraphQL Server

Additional Information

https://github.com/PAIDNetwork/substrate-api-graphql

https://subsquid.io/

https://subquery.network/

How to test

1. setup subsquid archiver
2. setup subsquid indexer
3. setup postgres db
4. setup subsquid graphql
5. expose endpoints and post a query
6. receive data and nod.

Context

As user I want to browse through organisations and DAOs so I discover organisations and find organisations I am interested in.

Tasks

[#82] Organisations Content Area
[#57] Organisation Card Component
[#83] Sorting
[#84] Filtering
[#87] Search

Additional Information

Epic handles the whole organisation list page (grid view 😏 )

User Story

--

Acceptance Criteria

1. Reacreate the forms from the beta to haiku // default mui style
2. The forms can be impotated into any component and have a callback for the data.
3. Form validation is implemented with react-hook-form and yup

Form template for the following forms were created

• Create dao
• Create campaign
• Create votings

Further informations

https://github.com/jquense/yup
https://react-hook-form.com/get-started

User Story

As user I want to select the Network I want to connect with on GameDAO so I can use the right network which suits my needs.

This is split in to parts:

• frontend and
• graphql/api middleware

Acceptance Criteria

1. get networks from api

• zero testnet
• zero mainnet
• acala
• picasso
• statemine
• statemint
• kusama

2. get networks from app context

3. on demand / continuous connection

4. create network selector dropdown featuring relevant chains to select from

• zero testnet
• zero mainnet
• acala
• picasso

Additional Information

How to test

1. go to website
2. select network
3. see connected network in blocktime visualizer

User Story

As frontent engineer I want to display all chain data which were exposed from GraphQL to be able to easily develop the frontend in the future.

Acceptance Criteria

1. write GraphQL queries for haiku to replace chain queries from beta
2. copy frontend files and start to migrate beta features one by one to use the new GraphQL APIs in haiku

Additional Information

• use a library like Apollo to interact with GraphQL

How to test

1. a
2. b
3. c
4. d

User Story

As user who interacts with an address form field I want to be able to enter an address and also to select an address from the dropdown fielt so dont make any errors while entering data.

Acceptance Criteria

1. each wallet address input field shall be an autocomplete-input dropdown
2. when entering a polkadot-chain account address it should be transformed into a local chain address (eg. ZERO)
3. the form field checks if the address is a valid address.

Additional Information

• https://mui.com/components/autocomplete/#free-solo
• https://github.com/polkadot-js/common/blob/master/packages/util-crypto/src/address/check.ts

How to test

1. see dropdown
2. see your addresses inside
3. ability to enter another address
4. polkadot address transforms into a local chain address

User Story

As user I want to see organisations which i am a member of, so I can easily select and switch between organisations

Acceptance Criteria

1. A quick access bar listing organisations is in place (for all viewports)
   1.1. all organisations the user is a any type of member / owner of are listed
   1.2. the organisations are sorted alphabetical
   1.3. Desktop: The sidebar is always visible. Fixed on the left side of the browser window
   1.4. Mobile: The side bar is shown by clicking on the 3 dots sitting within the header component
   1.4.1. When the sidebar is present, the page content is moved to the right by the width of the sidebar

2. clicking/tapping on one of the organisation logos highlights the clicked organisation and opens the organisation overview page
   2.1. When organisation is selected the position of the avatar remains at the original position

3. The sidebare comes in following states:
   3.1 No DAO: This is used when the connected wallet is no member / owner of any organisation. In this case the sidebar shows a plus circle which links to the dao creation page
   3.1.1. if the user is not connected, a modal which can be closed appears and displays "Please connect your wallet."
   3.2. DAOs listed: If one or more DAOs are listed they are shown at the beginning of the list followed by a separator line and the dao creation circle button
   3.3. DAO with update: If a DAO has a notification (example new proposal) a small circle is shown on top of the DAO avatar (if the user has seen the news, the notification is gone)
   3.4. Many DAOs: If the sidebar lists more organisations than there is available space, I can scroll vertically with the mouse or swipe with the finger through these organisations. The last item in the list is cut off and a gradient overlay is on top of the avatar to indicate the scroll

4. The sidebar is sticky and the footer will be right from the sidebar for both viewports

Additional Information

• The Design in Figma are shown in desktop and mobile view and are customized components.

UI Mockups: UI Mockups: https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A17
Design system: https://www.figma.com/file/5L4VE8EIhRVB6kfIB50zlT/Minimal-Web?node-id=1489%3A112412

• part of EPIC: #68

Interaction Example Mobile

How to test

1. be not loggedin and interact with the side bar (click the + and receive modal with the message to connect your wallet) on mobile and desktop
2. be loggedin and no member of a DAO, click the + and get to the create organisation form on mobile and desktop
3. be loggedin an member of one DAO, click the DAO and see page content changing to the dao detail page and the url is updated
4. be loggedin and member of several DAOs, resize your screen and scroll the DAOs make sure everything looks like in the design on mobile and desktop, click on a DAO an make sure that the page content and url is updated

User Story

As user I want to see all organization on a list page and to filter / sort / search to discover and join DAOs I am interested in

Acceptance Criteria

1. The list page shows the title of the page on the left
2. A create button is shown on the right, clicking on that button, it links to the create DAO process page
3. A search box is placed to search for organizations, search covered here: [#87]
4. Filter is placed, covered here [#84]
   4.1 Clicking on filter opens a side panel showing the filter options
5. Sorting is shown, covered here [#83]
   5.1 Clicking on the sorting it opens a dropdown listing the sorting options
6. Organization cards are shown
   6.1 The organisation cards includes an avatar, the title, member count and access control info. Covered here: [#57]
7. Per default there are 30 org. cards shown
   7.1 After 30 org. cards it shows a load more button which when clicket loads additional 30 products. This is repeated until all products are loaded
8. Below the load more a helper text is shown indicating how many products are loaded and how many there are in total
9. integrate https://mui.com/components/skeleton/ for the loading status

Design

https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A18

Additional Information

• part of EPIC: #86

How to test

1. a
2. b
3. c
4. d

User Story

As a user I want to see new created campaigns, proposals, etc. without reloading the website.

Acceptance Criteria

1. Subsquid GraphQL pushes event to ?
2. Frontend Haiku should receive the event and handle it (add new campaign to list, update proposal state...)

Additional Information

• Subsquid doesn't support subscriptions. They have it on their backlog but don't have a timeline for now.
• We need to look which service we want to use for subscriptions. (Redis, Google Pub/Sub...)

How to test

1. Create a new DAO/Campaign/Proposal
2. Check if frontend adds the new created item without reloading the website.

User Story

As frontend developer I want to query all chain information through a graphql api so I can use information into the frontend easily, gain performance and separate frontend from backend. The GraphQL endpoint should be deployed in the GameDAO infrastructure. (GameDAO-GitHub-Account instead of a Private-GitHub-Account)

Acceptance Criteria

1. GraphQL via endpoint reachable
2. GraphQL exposes chain data

Additional Information

Deployment:

1. Go to https://app.subsquid.io/sign-in
2. Login via GitHub
3. Go to https://app.subsquid.io/dashboard
4. Create a new Squid
5. Checkout the gamedao-protocol-indexer repo
6. Run yarn / npm install
7. Go back to the Squid Website and run the commands on the right side (sqd auth & sqd release)

npx sqd auth --key sqd_key
npx sqd squid:release squid_name@version --source https://github.com/gamedaoco/gamedao-graph#master
Example:
npx sqd squid:release gamedao-protocol-indxer@v001 --source https://github.com/gamedaoco/gamedao-graph#master

How to test

1. Go to the GraphQL endpoint
2. Check different chain data against the chain directly on polkadot.js app

User Story

As user I want to create an organisation easily so I can get as quick as possible my Organisation / DAO.

Acceptance Criteria

1. the create organisation process is split into 4 Steps
2. First step: enter Name and view slug URL (name, slug) #109
3. Second step: select control mechanism (either prime controls treasury or community) (body_type) #110
4. Third step: access mechanism and member limit #111
5. clicking save organisation saves the data either in the local browser storage, a centralised db or decentralised db connecting to the wallet id - and redirects the user to the organisation detail page.

Additional Information

body_type

0 = prime governed
1 = community governed

access-type

0 = open
1 = private whitelist
2 = private application
3 = private whitelist & application

How to test

1. a
2. b
3. c
4. d

User Story

As user I want to access all proposals of my organisation so I can vote on open proposals or have some detailed information about the proposal

Acceptance Criteria

1. within the organisation detail page there is a link to all organisation proposals
2. a view lists all proposals of the organisation
3. it is possible to create a proposal (proposal form)
4. voting results + voterslist are visible

Additional Information

• for reference of detail information look at beta.gamedao.co
• a design is missing and this ticket aims to have the feature available of seeing and creating proposals + vote on them

How to test

1. see proposals
2. create proposals
3. vote
4. see results
5. see voters list

Describe the bug

Do not add stylesheets using next/head (see tag with href="/iconfont.css"). Use Document instead.
See more info here: https://nextjs.org/docs/messages/no-stylesheets-in-head-component
— wasn't this fixed by me before?

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Additional context
Add any other context about the problem here (eg. device/browser)

User Story

As organisation member I want to create proposals and participate in voting so I can actively influence the organisation agenda.

Acceptance Criteria

1. Have a proposals & votings section within an organisation
2. Create a proposal flow
   2.1 select out of all proposal types (eg: spending, campaign withdrawal, membership application, two-choice, multiple-choice, single select, multi select)
   2.2 select voting type (eg. simple majority, voting power, consider quorum ()
3. voting period (start, end)
4. List proposals
   4.1 vote on proposals

Additional Information

• not all ideas are mandatory for AA cycle, please focus for AA cycle on currently active votings: campaign withdrawal, simple two-choice votings.
• bring proposal and types into a meaningful priority order
• outcome should be wireframes and MVP for AA cycle

Figma Links

Pls have a look at the
Wireframes for Create & vote on proposal
https://www.figma.com/file/NQ2MpTJlQ1fwWhSZ5hsHCx/Wireframe-%26-Sketches?node-id=295%3A31999
@5-mark

User Story

As content maintainer and/or translator I want to maintain texts and translations on the free to use software Weblate so I can edit the texts on gamedao

Acceptance Criteria

1. Weblate is installed on an accessible cloud server (AWS self hosted) (please use docker image documented here )
2. Project "GameDAO" is set up and connected with the corresponding github repository and folder where the localized translation files are located
3. a non-admin user is created (eg. email address of @5-mark and credentials and URL are shared with him so he can access and start maintaining texts.

Additional Information

• please select a proper location to store admin user credentials for this and coming tools running on AWS

How to test

1. user can access and login to the provided URL
2. user can change a text and create a PR within Weblate
3. PR can be merged and text change is visible on haiku

User Story

As frontend user I want to be able to see my NFT assets scattered among various substrate based networks in my profile view.

Acceptance Criteria

1. Account View in sidebar
2. Query NFTs on Statemine, Kusama and show them (e.g. as text)

Additional Information

1. https://guide.kusama.network/docs/learn-assets

2. singular
   https://github.com/rmrk-team/rmrk-spec
   https://www.crowdcast.io/e/buidl
   https://github.com/rmrk-team/rmrk-tools/

How to test

1. connect wallet
2. select account view
3. see assets from all mentioned networks

User Story

As gamedao user I want to see texts in my language so I can understand what gamedaos does and how it works

Acceptance Criteria

1. read keys from translation system (weblate)
2. display key values in frontend

Additional Information

How to test

1. a
2. b
3. c
4. d

User Story

as a user i want to connect to different networks to access individual protocols and features

Acceptance Criteria

1. show network connector
2. on click show networks
3. on select switch to network

Additional Information

How to test

1. see
2. click
3. select
4. success

User Story

As user I want to be able to sort the organisation overview so I can sort organisations the way I like to.

Acceptance Criteria

1. The organisation list page shows a sorting option at the top right
2. Default sorting, if not manually set, is Member: High-Low
3. If sorting option is clicked, it opens a dropdown (flyout) which lists all available sorting options
4. Clicking on an sorting option, the org. cards are reloaded on the page
   4.1 The active selection is written out next to the "Sort by:" text
5. configured sorting remains on my browser until I change it
6. Following sorting options are present
   7.1. Member: High-Low
   7.2 Member: Low-High
   7.3. Created: Newest first
   7.4. Created: Oldest first
7. The sorting component can be deactivated / activated via configuration
8. The sorting options can be can be configured (active, not active per sorting option)

Design

https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A18

Additional Information

• part of EPIC: #86

How to test

1. test the configuration by activating / deactivating options and the component
2. click the sorting element
3. select another sorting than the default
4. see page reordering the organisation cards
5. go on another page
6. click the organisation link on the top again
7. see same sorting applied as when you left the page

User Story

As engineer I want to deploy smart contracts on ZERO chain so I can use features which are written in solidity.

Acceptance Criteria

1. check frontier pallet and integrate on ZERO chain
2. deploy test smart contract interacting with ZERO chain data (eg. ZERO token balance)
3. test the feature

Additional Information

• to be checked: how to deploy smart contract as external dev?
• block explorer to be EVM compatible

How to test

1. a
2. b
3. c
4. d

User Story

As user I want to filter the organisations so i can narrow down organisations I am looking for.

Acceptance Criteria

1. A filtering option is placed on the top of the organizations list page
2. Per default no filter option is selected
3. Clicking on the filter option triggers a slide-out from the right showing the filter options
   3.1 The slideout shows the title "Filters" followed by a close icon
   3.2 Filter options are liste below each other
   3.3 At the bottom of the slide-out panel a "clear" button is present
4. Following filter options are available
   4.1. By organisation type: (Individual, Company, DAO, Hybrid) --> all checkboxes // see additional infomation
   4.2. By member access: (open, private) --> radio buttons
   4.3. By fee model (fee, no fee) --> radio buttons
5. filter takes also search term into consideration
6. The filter component can be deactivated / activated ... @5-mark

Design

https://www.figma.com/file/8xFCnDl6SlUOonFm1V20ne/?node-id=3%3A18

Additional Information

Organisation Type Rules:
Individual = treasury owner is prime
Company = treasury owner is prime + KYB done
DAO = treasury owner is community
Hybrid = treasury owner is community + KYB done

part of EPIC: [#86]

How to test

1. a
2. b
3. c
4. d

User Story

As #user I want to see the page quickly so I can use it.

Acceptance Criteria

1. go to page
2. no waiting until landingpage is shown

How to test

1. go to page
2. landingpage shows quickly

User Story

As #user I want to browse available games for purchase so I can select to see details and buy them.

Acceptance Criteria

1. Browse Grid View of available games from license pallet
2. Select Item in Grid to show detail page
3. Show buy buttons in both to trigger TX to get license NFT
4. Show sell buttons in both views, when user already has a license NFT

Additional Information

• requires licensing pallet

How to test

1. a
2. b
3. c
4. d