Adjust main app loading screen UI

Trio/Resources/Assets.xcassets/app_icon_images/trioCircledNoBackground.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "ComplicationIcon.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Trio/Resources/Assets.xcassets/app_icons/trioCircledNoBackground.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "ComplicationIcon.png",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Trio/Sources/Models/Icons.swift

@@ -7,6 +7,7 @@ enum Icon_: String, CaseIterable, Identifiable {
     case trioWhiteShadow
     case trioColorBG
     case trioWhite
+    case trioCircledNoBackground
     case trio3D
     case wilford = "diabeetus"
     case catWithPod

Trio/Sources/Modules/Main/View/MainLoadingView.swift

@@ -4,58 +4,77 @@ extension Main {
     struct LoadingView: View {
         @Binding var showError: Bool
         let retry: () -> Void
+
+        private let versionNumber = Bundle.main.releaseVersionNumber ?? String(localized: "Unknown")
+
         var body: some View {
-            VStack {
-                Spacer().frame(maxHeight: 92)
-                Image(.trioWhite)
-                    .resizable()
-                    .scaledToFit()
-                    .frame(width: 92, height: 92)
-                Spacer().frame(maxHeight: 32)
-                ZStack {
-                    // Invisible placeholder with same height as progress view
-                    Color.clear.frame(width: 30, height: 30)
-                    ProgressView()
-                        .scaleEffect(1.5)
-                        .opacity(showError ? 0 : 1)
-                }
-                Spacer().frame(maxHeight: 32)
-                if showError {
-                    Text("Something went wrong while loading your data. Please try again in a few moments.")
-                    Spacer().frame(maxHeight: 32)
-                    RetryButton(action: retry)
-                } else {
-                    Text("Getting everything ready for you...")
+            ZStack {
+                LinearGradient(
+                    gradient: Gradient(colors: [Color.bgDarkBlue, Color.bgDarkerDarkBlue]),
+                    startPoint: .top,
+                    endPoint: .bottom
+                )
+                .ignoresSafeArea()
+
+                VStack {
+                    Spacer().frame(maxHeight: 92)
+
+                    Image(.trioCircledNoBackground)
+                        .resizable()
+                        .scaledToFit()
+                        .frame(width: 92, height: 92)
+                        .shadow(color: Color.white.opacity(0.1), radius: 5, x: 0, y: 0)
+
+                    Text("Trio v\(versionNumber)")
+                        .fontWeight(.heavy)
+                        .foregroundStyle(Color(red: 148 / 255, green: 102 / 255, blue: 234 / 255))
+                        .padding(.vertical)
+
+                    if showError {
+                        Spacer().frame(maxHeight: 60)
+
+                        VStack(alignment: .leading, spacing: 12) {
+                            Text("Oops, there was an issue!").font(.title3).bold()
+
+                            Text("Something went wrong while loading your data. Please try again in a few moments.")
+                                .foregroundStyle(.white)
+                        }
+                        .padding(.horizontal, 24)
+                        .foregroundStyle(.white)
+
+                        Spacer()
+
+                        RetryButton(action: retry).padding(.bottom, 60)
+                    } else {
+                        Spacer().frame(maxHeight: 100)
+
+                        CustomProgressView(text: String(localized: "Getting everything ready for you...")).foregroundStyle(.white)
+
+                        Spacer()
+                    }
                 }
-                Spacer()
             }
-            .padding()
         }
     }
 
     struct RetryButton: View {
         var action: () -> Void
-        var label: String = "Retry"
-        var iconName: String = "arrow.clockwise"
 
         var body: some View {
             Button(action: action) {
                 HStack(spacing: 8) {
-                    Image(systemName: iconName)
-                        .font(.system(size: 16, weight: .medium))
-                    Text(label)
-                        .font(.system(size: 16, weight: .semibold))
+                    Image(systemName: "arrow.clockwise")
+                    Text("Retry")
                 }
-                .padding(.horizontal, 20)
-                .padding(.vertical, 12)
+                .frame(width: UIScreen.main.bounds.width - 60, height: 50)
+                .font(.title3).bold()
                 .background(
                     Capsule()
-                        .fill(Color.blue)
+                        .fill(Color.tabBar)
                 )
                 .foregroundColor(.white)
                 .shadow(color: Color.black.opacity(0.1), radius: 5, x: 0, y: 2)
             }
-            // .buttonStyle(ScaleButtonStyle())
         }
     }
 }