Chose role prototype.

src/components/AuthUser/ChoseRole/ChoseRole.test.tsx

+import React from 'react';
+import { render } from '@testing-library/react';
+import { ChoseRole } from './ChoseRole';
+
+describe('<ChoseRole />', () => {
+  it('renders without crashing', () => {
+    const wrapper = render(<ChoseRole />);
+    expect(wrapper.queryByTestId('ChoseRole')).toBeTruthy();
+  });
+});

src/components/AuthUser/ChoseRole/ChoseRole.tsx

+import React, { FC, useContext, useEffect, useState } from 'react';
+import axios from 'axios';
+import Button from '@material-ui/core/Button';
+import { AuthContext } from '../AuthContext';
+
+const choseAndForward = (e: unknown): void => {
+  // Do nothing.
+};
+
+/**
+ * Screen that let's users decide role between available roles.
+ * This is intended to use when a user has more than one role.
+ * @returns ChoseRole component.
+ */
+export const ChoseRole: FC = () => {
+  const [userRoles, setUserRoles] = useState<Array<string>>(['']);
+
+  useEffect(() => {
+    const getUserRoles = async (): Promise<unknown> => {
+      const response = await axios('/api/web/get_role');
+      setUserRoles(response.data.token);
+      return null;
+    };
+    getUserRoles();
+  }, [userRoles]);
+
+  const { role } = useContext(AuthContext);
+  return (
+    <div data-testid="ChoseRole">
+      <Button
+        variant="outlined"
+        color="default"
+        onClick={(e) => choseAndForward(e)}
+      >
+        {role}
+      </Button>
+    </div>
+  );
+};