[ADV.PAYMENTS][STREAMING PAYMENT] As a Colony member, I can create STREAMING PAYMENT action and complete the entire STREAMING PAYMENT FLOW

[AdrianDudko]

Teamwork task: [ADV.PAYMENTS][STREAMING PAYMENT] As a Colony member, I can create STREAMING PAYMENT action and complete the entire STREAMING PAYMENT FLOW

Related sub-issues/PR's

• Create an action (form) datepicker - feat: datepicker with time #2780, feat: streaming payment form #2927
• Preview action feat: streaming payment preview base #2938
• Streaming Payment Flow/Stepper feat: streaming payment preview base #2938
• Cancel feat: cancel streaming payment #3149
• Edit
• Decision Method - Reputation feat: create streaming payment via reputation #4268
• Decision Method - Multi Sig

Description

Provides the ability to Create a Streaming payment action and complete it.
Notion spec https://www.notion.so/colony/Streaming-Payments-Action-ab883324ab694de4b15d8db3e3c6d153
Handover doc https://www.notion.so/colony/Streaming-Payments-handover-92b9fad4b7c045e7bbbd3f4e494bd248

Acceptance Criteria

• General requirements

  • Should be in alignment with desktop/tablet/mobile design from Designs.
  • Should use existing components and styles where possible for consistency.
  • All times and dates should be the displayed in users time zone (best guess).
    • As a fallback, it should show the time zone as UTC +0.
  • Streaming payment action type should not be visible if the extension is not installed.

• Create a Streaming payment

  • User can select the “Streaming Payment” option from the “Action type” options.

    • This should update the action creator with the relevant fields.

  • Fields

    • Stream from:
      • The team to stream the funds from.
      • Shows the team dropdown.
    • Recipient:
      • User is able to select or enter in the recipient for the stream.
      • This should show the full members list dropdown, with the ability to search and enter an address.
    • Starts:
      • User as the following options.
        • User can select “Start immediately”.
        • Users can use a date picker to select a start date and time for the stream.
      • Popup date picker is used for input.
        • Date picker includes the following:
          • Show today's date as default.
          • Quick month navigation arrows.
          • Click on month and year to change in additional popup.
          • Full month daily view.
            • When a earlier date is selected, a [warning message](https://www.figma.com/file/5V8pr7iMwXsT9L3VAZsmUt/Colony-v5?type=design&node-id=3804-483605&mode=design&t=5E5BNq0pHM4TM1AE-11) will be displayed and the start date will be displayed in yellow.
          • Time input and select field.
            • Input allows for masked time input.
            • Select has preset times every hour of a full day.
      • Time zone is based on the user’s computer clock, best guess, or the fallback.
    • Ends:
      • Users can select the end condition for the stream.
      • When cancelled
        • Stream runs indefinitely, which stops only when it is cancelled.
      • Limit reached
        • Stream ends when a preset amount of tokens have been earnt.
        • Adds additional input to allow limit amount to be added.
      • Fixed time
        • Stream ends when a user entered date is reached.
        • Popup date picker is used for input.
        • Time zone is based on the user’s computer clock, best guess, or the fallback.
    • Amount field
      • The amount of tokens to stream in the selected token.
      • No validation is required for there to be an amount.
    • Amount per
      • The unit rate of the stream. Used to calculate the rate based on the amount. e.g. 1,000 CLNY / Month
      • Options:
        • Hour
        • Day
        • Week
        • Custom:
          • This option allows the user to custom number of days
          • The “__ days” will only accept numbers equal or bigger than 1. Any other value entered should trigger an error message.
          • The default value of this field will be “30”
      • The rate to send to the contracts need to align and should be calculated.
    • Decision method
      • Should support all available decision methods.
        • Permissions
          • Should start the stream on creation.
          • Streams can be created by those with “Payer” level permissions or higher (”Administration” and “Funding” custom permissions as on the contracts).
        • Multi-sig
          • Should start the stream after clicking start stream when approved and finalized.
          • Will require signing by “Payer” level multi-sig permissions or higher (Multi-sig ”Administration” and Multi-sig “Funding” custom permissions as on the contracts).
        • Reputation
          • Should start the stream after clicking start stream once motion has passed.
          • Created in
            • You should only be able to select to create the motion in the selected team, or a parent team.
            • You should not have the option to select any other adjacent of child team.
            • Changing the team above it should update the Created in team to match it.
            • If the team has not been selected and the Created in field is clicked, then any team can be chosen, but it should also change the team field above it to match.
    • Limit
      • Maximum amount of tokens to stream. Stream will end when reached.
      • Only shows if the “Limit reached” option is selected in the Ends field.
      • Does not require validation.

  • Cancelling

    • Streams can be cancelled by those with “Mod” level permissions or higher (”Administration” custom permissions as on the contracts) or by another supported decision method.
    • Cancelling stops the earning from the stream at the time of cancellation.
    • Any funds that have been earnt and unclaimed to that point will still be claimable.
    • On the contracts, it is possible only by the recipient to also claim and waive payments they are owed. However, this is currently not supported in the UI.

  • Editing

    • Streams can be edited by those with “Payer” level permissions or higher (”Administration”, “Funding” and “Arbitration” custom permissions as on the contracts) or by another supported decision method.
    • Technically, on the contracts different permissions are required to edit different aspects, such as “Administration” is required to change stream times, and “Funding” is required to change amounts. However, in the UI, we should require both to simplify the user experience.
    • Editing a stream allows users to change the following fields:
      • Starts
        • Only possible if the stream has not already started.
        • We should show a tooltip on the disabled field when editing with the text “Stream has already started, start time cannot be edited.”
      • Ends
        • Editing only this field does not out pay out unclaimed funds.
      • Amount
      • Amount per
      • Limit (if visible)
    • Editing a stream will pay out all unclaimed funds to the recipient.
      • In the case where not enough funds are available to be claimed it should show an error in the finalize widget that there are not enough funds to pay and edit the stream.

• Pay funds

  • Anyone is able to trigger the payout of earned funds to the recipient at any point.
  • Should validate if there are not enough funds to be paid out.
  • Paid to date
    • Shows the total amount of the stream that has been paid out to the recipient.
  • Available to claim
    • Shows the total amount of funds that is able to be claimed at that time.
    • Number should increase live in the app based on the rate of stream.
  • The status of the stream should also be visible, such as:
    • “Not started” - Stream has not started yet.
    • “Stream active” - Funds are streaming.
    • “Stream ended” - The stream end date has been reached.
    • “Limit reached” - The limit has been reached.
    • “Stream cancelled” - The stream was cancelled.

• Action Label Tooltips

  Action	Label	Tooltip text
  Streaming payment	Stream from	Team source of the payment.
  	Recipient	Member or address receiving the streaming funds.
  	Starts	Date to start the stream. Stream starts from this date, regardless of approval date.
  	Ends	Conditions for how the stream should end or not.
  	Amount	Funds to be streamed over the chosen “Amount per” period.
  	Amount per	Defines the streaming rate (e.g., 500 CLNY/Month).
  	Limit	The total amount of funds to be streamed.

• Action Metadata
  https://www.notion.so/colony/Staged-Payments-Action-f4e1dfd70e864613a5052a010b7b0116?pvs=4#dc7aaa04977e43969d76f18a3fac8ddd

• “Create …” button text

  Action	Text
  Streaming payment	Create stream

Design

Create a Streaming payment
https://www.figma.com/file/5V8pr7iMwXsT9L3VAZsmUt/Colony-v5?type=design&node-id=3804-483605&mode=design&t=Hb0wdKfaJeH7j8aE-4

Streaming payment flow
https://www.figma.com/design/5V8pr7iMwXsT9L3VAZsmUt/Colony-v5?node-id=22702-224863&t=MgFC4ot1HPRPWPNZ-4