All files / app/pages/stacking/direct-stacking/components confirm-and-stack.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { StackingStep, StackingStepAction } from '../../components/stacking-form-step';
import { StackingUserConfirm } from '../../components/stacking-user-confirm';
import { DirectStackingTerms } from './direct-stacking-terms';
import React, { FC, useState } from 'react';
 
interface ConfirmAndLockStepProps {
  timeUntilNextCycle: string;
  estimatedDuration: string;
  onConfirmAndLock(): void;
}
 
export const ConfirmAndStackStep: FC<ConfirmAndLockStepProps> = props => {
  const { onConfirmAndLock } = props;
  const [hasUserConfirmed, setHasUserConfirmed] = useState(false);
 
  return (
    <StackingStep title="Confirm and stack" mb="300px">
      <DirectStackingTerms mt="loose" />
      <StackingUserConfirm
        onChange={useConfirmed => setHasUserConfirmed(useConfirmed)}
        mt="extra-loose"
      />
      <StackingStepAction onClick={onConfirmAndLock} isDisabled={!hasUserConfirmed} type="submit">
        Confirm and start stacking
      </StackingStepAction>
    </StackingStep>
  );
};