import React from 'react';
import { Box, Text } from 'folds';
import * as css from './styles.css';
import pkg from '../../../../package.json';

export function AuthFooter() {
  return (
    <Box className={css.AuthFooter} justifyContent="Center" gap="400" wrap="Wrap">
      <Text as="a" size="T300" href="https://lotusguild.org" target="_blank" rel="noreferrer">
        About
      </Text>
      <Text
        as="a"
        size="T300"
        href="https://code.lotusguild.org/LotusGuild/cinny/releases"
        target="_blank"
        rel="noreferrer"
      >
        v{pkg.version}
      </Text>
      <Text as="a" size="T300" href="https://matrix.lotusguild.org" target="_blank" rel="noreferrer">
        Community
      </Text>
      <Text as="a" size="T300" href="https://matrix.org" target="_blank" rel="noreferrer">
        Powered by Matrix
      </Text>
    </Box>
  );
}