Authenticated based UI components

[Ushcode]

restore stuff like

    useEffect(() => {
    const fetchRoles = async () => {
      try {
        const { roles } = await (await fetch('/api/userinfo')).json() as { roles: Roles };
        setRoles(roles);
      } catch (error) {
        console.error('Error fetching user Info', error);
      }
    };

    fetchRoles();
  }, []);