Use MaterialCardView to update the UI of URL Widget

1. What is the general goal of the feature?
Currently, we have a simple button for URL Widget in Collect App. To make more use of material components in the app, I propose that we make use of MaterialCardView to implement this widget.

To make the widget look more appealing, we can extract the icon and title of the web page from the URL. In case the URL is not specified, we can make use of default values. We can make use of Goose or any other library to extract the details of the webpage.

Your views and feedback on this are welcome!

This certainly looks a lot nicer. I have concerns though:

  • As with everything in Collect we can't assume the user will be online so we'd need to think about the default version of this just showing the URL itself and not the title/favicon.
  • This potentially adds a lot of noise and makes it less clear where the user needs to click? I've been looking around for examples of the URL widget in use to get a better sense of this on the forum but can't find any good ones.

I'd be interested to get the perspective of @yanokwa and @LN here as they might have better contet on how people are using the URL widget.