Adjust Loading style to match RN activity indicator style

[steffenkleinle]

Describe the Problem

At the moment, we use different components to indicate that some progress is happening:

1. ProgressSpinner.tsx: Custom full screen component including a spinner around the integreat logo (primarily used in LoadingErrorHandler)
2. RefreshControl: React native component used in scroll views/list views if actual content is displayed (primarily used in LoadingErrorHandler)
3. LoadingSpinner.tsx: Based on react native ActivityIndicator component, for example used when sending feedback

While the progress spinner (1.) is distinct and required, the refresh control (2.) and the loading spinner (3.) are used similarly and also look/behave similarly(but not the same. We should therefore unify the styling.
Personally I like the default style of the refresh control a lot more,

Describe Your Preferred Solution

Adjust the styling of the LoadingSpinner such that it looks the same as the refresh control:

• Change the spinner color to black
• Add an elevated white circle around it

Furthermore, adjust the naming of our different loading spinner components such that the purpose is clear:

1. ProgressSpinner -> LoadingScreen
2. RefreshControl -> RefreshControl (no change, this is a react native component)
3. LoadingSpinner -> base/ActivityIndicator (move to base folder)

Describe Possible Alternatives

Adjust the style of the refresh control or just keep it as it is.

Related Issues

N/A

Additional Information

To see the ProgressSpinner (1.): Select a new city
To see the RefreshControl (2.): Just pull down to refresh on any page
To see the LoadingSpinner (3.): Send a feedback (or change

integreat-app/native/src/components/Feedback.tsx

Line 64 in 390dba3

if (sendingStatus === 'sending') {

to if (true) {