import * as React from 'react';
import { withTranslation, WithTranslation } from 'utils/i18n';

import Step from 'containers/checkout';
import { RelocationDate, Addresses, Properties } from 'containers/checkout/steps/flutningur';
import ConfirmRelocation from 'containers/checkout/steps/flutningur/ConfirmRelocation';

interface IProps extends WithTranslation {
  step: string;
  subscriptionId: string;
  ssn: string;
  namespacesRequired: string[];
}

const Relocation = ({ subscriptionId, t, ssn }: IProps) => {
  return (
    <Step
      color="yellow"
      titleSteps={[
        t('addresses.title'),
        t('properties.title'),
        t('relocationDate.title'),
        t('confirmRelocation.title'),
      ]}
      returnLink={subscriptionId && `/${ssn}/thjonusta/${subscriptionId}/stillingar`}
      checkoutLink="flutningur"
      totalSteps={4}
      subscriptionId={subscriptionId}
    >
      <Addresses />
      <Properties />
      <RelocationDate />
      <ConfirmRelocation />
    </Step>
  );
};

Relocation.getInitialProps = ({ query }: any) => {
  const { step, subscriptionId, ssn } = query;

  return {
    step,
    subscriptionId,
    ssn,
    namespacesRequired: ['flutningur'],
  };
};

export default withTranslation('flutningur')(Relocation);