From 475e1834bf7bf0039e4f3528f9a5af11bba35e27 Mon Sep 17 00:00:00 2001
From: shabinder <dev.shabinder@gmail.com>
Date: Sat, 6 Feb 2021 22:31:20 +0530
Subject: [PATCH] Images etc

---
 .../kotlin/com/shabinder/common/ui/Images.kt  | 36 ++++++++++++++
 .../shabinder/common/list/SpotiFlyerList.kt   |  6 ++-
 .../shabinder/common/list/SpotiFlyerListUi.kt | 20 ++++----
 .../kotlin/com/shabinder/common/ui/Images.kt  | 17 +++++++
 .../kotlin/com/shabinder/common/ui/Actual.kt  | 26 +++++++++-
 .../kotlin/com/shabinder/common/ui/Images.kt  | 34 ++++++++++++++
 .../src/main/res/drawable/ic_arrow.xml        | 26 ++++++++++
 .../main/res/drawable/ic_download_arrow.xml   | 26 ++++++++++
 .../src/main/res/drawable/ic_error.xml        | 31 ++++++++++++
 .../src/main/res/drawable/ic_gaana.xml        | 32 +++++++++++++
 .../src/main/res/drawable/ic_heart.xml        | 24 ++++++++++
 .../main/res/drawable/ic_spotiflyer_logo.xml  | 47 +++++++++++++++++++
 .../src/main/res/drawable/ic_spotify_logo.xml | 20 ++++++++
 .../src/main/res/drawable/ic_tick.xml         | 30 ++++++++++++
 .../src/main/res/drawable/ic_youtube.xml      | 23 +++++++++
 .../res/drawable/ic_youtube_music_logo.xml    | 22 +++++++++
 .../kotlin/com/shabinder/common/Dir.kt        |  2 +-
 .../kotlin/com/shabinder/common/Dir.kt        | 10 ++--
 18 files changed, 415 insertions(+), 17 deletions(-)
 create mode 100644 common/compose-ui/src/androidMain/kotlin/com/shabinder/common/ui/Images.kt
 create mode 100644 common/compose-ui/src/commonMain/kotlin/com/shabinder/common/ui/Images.kt
 create mode 100644 common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Images.kt
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_arrow.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_download_arrow.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_error.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_gaana.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_heart.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_spotiflyer_logo.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_spotify_logo.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_tick.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_youtube.xml
 create mode 100644 common/compose-ui/src/main/res/drawable/ic_youtube_music_logo.xml

diff --git a/common/compose-ui/src/androidMain/kotlin/com/shabinder/common/ui/Images.kt b/common/compose-ui/src/androidMain/kotlin/com/shabinder/common/ui/Images.kt
new file mode 100644
index 00000000..d72bc715
--- /dev/null
+++ b/common/compose-ui/src/androidMain/kotlin/com/shabinder/common/ui/Images.kt
@@ -0,0 +1,36 @@
+package com.shabinder.common.ui
+
+import androidx.compose.foundation.Image
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.vectorResource
+
+@Composable
+actual fun DownloadImageTick(modifier: Modifier){
+    Image(
+        vectorResource(R.drawable.ic_tick),
+        "Download Done",
+        modifier
+    )
+}
+
+@Composable
+actual fun DownloadImageError(modifier: Modifier){
+    Image(
+        vectorResource(R.drawable.ic_error),
+        "Error! Cant Download this track",
+        modifier
+    )
+}
+
+@Composable
+actual fun DownloadImageArrow(modifier: Modifier){
+    Image(
+        vectorResource(R.drawable.ic_arrow),
+        "Start Download",
+        modifier
+    )
+}
+
+@Composable
+actual fun DownloadAllImage() = vectorResource(R.drawable.ic_download_arrow)
\ No newline at end of file
diff --git a/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerList.kt b/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerList.kt
index 18c6817f..bdb2023f 100644
--- a/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerList.kt
+++ b/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerList.kt
@@ -5,6 +5,7 @@ import com.arkivanov.decompose.ComponentContext
 import com.arkivanov.mvikotlin.core.store.StoreFactory
 import com.shabinder.common.*
 import com.shabinder.common.list.integration.SpotiFlyerListImpl
+import com.shabinder.common.spotify.Source
 import com.shabinder.common.utils.Consumer
 import com.shabinder.database.Database
 import kotlinx.coroutines.flow.Flow
@@ -43,7 +44,10 @@ interface SpotiFlyerList {
         object Finished : Output()
     }
     data class State(
-        val queryResult:PlatformQueryResult? = null,
+        val queryResult:PlatformQueryResult? = PlatformQueryResult(
+            "","",
+            "Loading","", emptyList(),
+            Source.Spotify),
         val link:String = ""
     )
 }
diff --git a/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerListUi.kt b/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerListUi.kt
index 28eef9ed..184f5d0f 100644
--- a/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerListUi.kt
+++ b/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/list/SpotiFlyerListUi.kt
@@ -1,12 +1,9 @@
 package com.shabinder.common.list
 
-import androidx.compose.foundation.Image
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.material.CircularProgressIndicator
-import androidx.compose.material.ExtendedFloatingActionButton
-import androidx.compose.material.MaterialTheme
-import androidx.compose.material.Text
+import androidx.compose.material.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
 import androidx.compose.runtime.getValue
@@ -14,6 +11,7 @@ import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
@@ -21,7 +19,7 @@ import androidx.compose.ui.unit.sp
 import com.shabinder.common.DownloadStatus
 import com.shabinder.common.Picture
 import com.shabinder.common.TrackDetails
-import com.shabinder.common.ui.ImageLoad
+import com.shabinder.common.ui.*
 import com.shabinder.spotiflyer.ui.SpotiFlyerTypography
 import com.shabinder.spotiflyer.ui.colorAccent
 import kotlinx.coroutines.CoroutineScope
@@ -89,13 +87,13 @@ fun TrackCard(
         }
         when(track.downloaded){
             DownloadStatus.Downloaded -> {
-                //Image(vectorResource(id = R.drawable.ic_tick))
+                DownloadImageTick()
             }
             DownloadStatus.Queued -> {
                 CircularProgressIndicator()
             }
             DownloadStatus.Failed -> {
-                //Image(vectorResource(id = R.drawable.ic_error))
+                DownloadImageError()
             }
             DownloadStatus.Downloading -> {
                 CircularProgressIndicator(progress = track.progress.toFloat()/100f)
@@ -104,9 +102,9 @@ fun TrackCard(
                 CircularProgressIndicator(progress = 100f,color = colorAccent)
             }
             DownloadStatus.NotDownloaded -> {
-                /*Image(vectorResource(id = R.drawable.ic_arrow), Modifier.clickable(onClick = {
+                DownloadImageArrow(Modifier.clickable(onClick = {
                     downloadTrack()
-                }))*/
+                }))
             }
         }
     }
@@ -151,7 +149,7 @@ fun DownloadAllButton(onClick: () -> Unit, modifier: Modifier = Modifier) {
     ExtendedFloatingActionButton(
         text = { Text("Download All") },
         onClick = onClick,
-        //icon = { Icon(imageVector = Image(R.drawable.ic_download_arrow),tint = Color.Black) },
+        icon = { Icon(imageVector = DownloadAllImage(),tint = Color.Black) },
         backgroundColor = colorAccent,
         modifier = modifier
     )
diff --git a/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/ui/Images.kt b/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/ui/Images.kt
new file mode 100644
index 00000000..18669e4d
--- /dev/null
+++ b/common/compose-ui/src/commonMain/kotlin/com/shabinder/common/ui/Images.kt
@@ -0,0 +1,17 @@
+package com.shabinder.common.ui
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.vector.ImageVector
+
+@Composable
+expect fun DownloadImageTick(modifier: Modifier = Modifier)
+
+@Composable
+expect fun DownloadAllImage():ImageVector
+
+@Composable
+expect fun DownloadImageError(modifier: Modifier = Modifier)
+
+@Composable
+expect fun DownloadImageArrow(modifier: Modifier = Modifier)
\ No newline at end of file
diff --git a/common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Actual.kt b/common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Actual.kt
index aa951174..9996c477 100644
--- a/common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Actual.kt
+++ b/common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Actual.kt
@@ -1,13 +1,37 @@
 package com.shabinder.common.ui
 
+import androidx.compose.foundation.Image
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.asImageBitmap
+import androidx.compose.ui.res.vectorXmlResource
 import com.shabinder.common.Picture
+import java.awt.image.BufferedImage
+import java.io.ByteArrayOutputStream
+import javax.imageio.ImageIO
 
 @Composable
 actual fun ImageLoad(
     pic: Picture?,
     modifier: Modifier
 ){
-
+    if(pic == null) {
+        Image(
+            vectorXmlResource("common/compose-ui/src/main/res/drawable/music.xml"),
+            modifier
+        )
+    }
+    else{
+        Image(
+            org.jetbrains.skija.Image.makeFromEncoded(
+            toByteArray(pic.image)
+        ).asImageBitmap(),
+            modifier = modifier
+        )
+    }
+}
+fun toByteArray(bitmap: BufferedImage) : ByteArray {
+    val baOs = ByteArrayOutputStream()
+    ImageIO.write(bitmap, "png", baOs)
+    return baOs.toByteArray()
 }
\ No newline at end of file
diff --git a/common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Images.kt b/common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Images.kt
new file mode 100644
index 00000000..91dad9cd
--- /dev/null
+++ b/common/compose-ui/src/desktopMain/kotlin/com/shabinder/common/ui/Images.kt
@@ -0,0 +1,34 @@
+package com.shabinder.common.ui
+
+import androidx.compose.foundation.Image
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.vector.ImageVector
+import androidx.compose.ui.res.vectorXmlResource
+
+@Composable
+actual fun DownloadImageTick(modifier: Modifier){
+    Image(
+        vectorXmlResource("common/compose-ui/src/main/res/drawable/ic_tick.xml"),
+        modifier
+    )
+}
+
+@Composable
+actual fun DownloadImageError(modifier: Modifier){
+    Image(
+        vectorXmlResource("common/compose-ui/src/main/res/drawable/ic_error.xml"),
+        modifier
+    )
+}
+
+@Composable
+actual fun DownloadImageArrow(modifier: Modifier){
+    Image(
+        vectorXmlResource("common/compose-ui/src/main/res/drawable/ic_arrow.xml"),
+        modifier
+    )
+}
+
+@Composable
+actual fun DownloadAllImage():ImageVector = vectorXmlResource("common/compose-ui/src/main/res/drawable/ic_download_arrow.xml")
diff --git a/common/compose-ui/src/main/res/drawable/ic_arrow.xml b/common/compose-ui/src/main/res/drawable/ic_arrow.xml
new file mode 100644
index 00000000..a426c154
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_arrow.xml
@@ -0,0 +1,26 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="36dp"
+    android:height="32dp" android:viewportWidth="512" android:viewportHeight="512">
+    <path android:fillColor="#516AEC" android:pathData="m296,288 l60,-60c7.73,-7.73 17.86,-11.6 28,-11.6 10.055,0 20.101,3.806 27.806,11.407 15.612,15.402 15.207,41.18 -0.3,56.687l-134.293,134.293c-11.716,11.716 -30.711,11.716 -42.426,0l-134.787,-134.787c-7.73,-7.73 -11.6,-17.86 -11.6,-28 0,-10.055 3.806,-20.101 11.407,-27.806 15.402,-15.612 41.18,-15.207 56.687,0.3l59.506,59.506v-232c0,-22.091 17.909,-40 40,-40 22.091,0 40,17.909 40,40z"/>
+    <path android:fillColor="#EC7EBA" android:pathData="m411.51,284.49 l-134.3,134.3c-11.71,11.71 -30.71,11.71 -42.42,0l-12.74,-12.74c10.69,4.06 23.23,1.77 31.84,-6.84l134.29,-134.29c12.51,-12.51 15.19,-31.7 7.57,-46.74 5.86,1.81 11.39,5.03 16.06,9.63 15.61,15.4 15.2,41.18 -0.3,56.68z"/>
+    <path android:fillColor="#EC7EBA" android:pathData="m251.88,27.72c-3.46,-3.46 -7.55,-6.29 -12.08,-8.3 4.95,-2.2 10.43,-3.42 16.2,-3.42 11.04,0 21.04,4.48 28.28,11.72s11.72,17.24 11.72,28.28v232l-15.329,15.329c-6.3,6.3 -17.071,1.838 -17.071,-7.071v-240.258c0,-11.04 -4.48,-21.04 -11.72,-28.28z"/>
+    <path android:fillColor="#6A82FB" android:pathData="m496,512h-24c-8.836,0 -16,-7.164 -16,-16s7.164,-16 16,-16h24c8.836,0 16,7.164 16,16s-7.164,16 -16,16z"/>
+    <path android:fillColor="#6A82FB" android:pathData="m40,512h-24c-8.836,0 -16,-7.164 -16,-16s7.164,-16 16,-16h24c8.836,0 16,7.164 16,16s-7.164,16 -16,16z"/>
+    <path android:fillColor="#FC5C7D" android:pathData="m416,512h-320c-8.836,0 -16,-7.164 -16,-16s7.164,-16 16,-16h320c8.836,0 16,7.164 16,16s-7.164,16 -16,16z"/>
+    <path android:fillColor="#4AFC5C7D" android:pathData="m256,443.552c-11.78,0 -23.56,-4.484 -32.527,-13.452l-134.786,-134.787c-10.503,-10.502 -16.287,-24.463 -16.287,-39.313 0,-14.708 5.688,-28.573 16.017,-39.042 10.31,-10.451 24.214,-16.233 39.151,-16.284h0.189c14.966,0 29.552,6.009 40.05,16.507l32.193,32.192v-193.373c0,-30.878 25.122,-56 56,-56s56,25.122 56,56v193.373l32.687,-32.687c10.501,-10.502 24.463,-16.286 39.313,-16.286 14.708,0 28.573,5.688 39.042,16.017 10.45,10.31 16.233,24.214 16.284,39.151 0.051,15.032 -5.966,29.698 -16.507,40.24l-134.292,134.292c-8.967,8.968 -20.747,13.452 -32.527,13.452zM127.761,232.673c-0.028,0 -0.056,0 -0.084,0 -6.349,0.021 -12.202,2.421 -16.479,6.758 -4.383,4.443 -6.797,10.327 -6.797,16.569 0,6.302 2.456,12.228 6.914,16.686l134.785,134.787c5.459,5.459 14.341,5.459 19.8,0l134.292,-134.292c4.556,-4.557 7.157,-10.937 7.134,-17.504 -0.021,-6.349 -2.421,-12.202 -6.758,-16.479 -4.443,-4.383 -10.327,-6.797 -16.569,-6.797 -6.302,0 -12.228,2.456 -16.687,6.914l-60,60c-4.575,4.577 -11.456,5.945 -17.437,3.469 -5.977,-2.478 -9.875,-8.313 -9.875,-14.784v-232c0,-13.234 -10.767,-24 -24,-24 -13.234,0 -24,10.766 -24,24v232c0,6.471 -3.898,12.306 -9.877,14.782 -5.978,2.476 -12.861,1.108 -17.437,-3.469l-59.506,-59.505c-4.536,-4.537 -10.882,-7.135 -17.419,-7.135z"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_download_arrow.xml b/common/compose-ui/src/main/res/drawable/ic_download_arrow.xml
new file mode 100644
index 00000000..4a92ae81
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_download_arrow.xml
@@ -0,0 +1,26 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="24"
+    android:viewportHeight="24"
+    android:tint="?attr/colorControlNormal">
+  <path
+      android:fillColor="@android:color/white"
+      android:pathData="M12,4c4.41,0 8,3.59 8,8s-3.59,8 -8,8s-8,-3.59 -8,-8S7.59,4 12,4M12,2C6.48,2 2,6.48 2,12c0,5.52 4.48,10 10,10c5.52,0 10,-4.48 10,-10C22,6.48 17.52,2 12,2L12,2zM13,12l0,-4h-2l0,4H8l4,4l4,-4H13z"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_error.xml b/common/compose-ui/src/main/res/drawable/ic_error.xml
new file mode 100644
index 00000000..9ebd8a0e
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_error.xml
@@ -0,0 +1,31 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="38dp" android:height="38dp"
+    android:viewportWidth="512" android:viewportHeight="512">
+    <path android:pathData="m512,256c0,141.387 -114.613,256 -256,256s-256,-114.613 -256,-256 114.613,-256 256,-256 256,114.613 256,256zM512,256">
+        <aapt:attr name="android:fillColor">
+            <gradient android:endX="512" android:endY="256"
+                android:startX="0" android:startY="256" android:type="linear">
+                <item android:color="#748AFF" android:offset="0"/>
+                <item android:color="#FF3C64" android:offset="1"/>
+            </gradient>
+        </aapt:attr>
+    </path>
+    <path android:fillColor="#000" android:pathData="m256,56c-110.281,0 -200,89.719 -200,200s89.719,200 200,200 200,-89.719 200,-200 -89.719,-200 -200,-200zM256,426c-93.738,0 -170,-76.262 -170,-170s76.262,-170 170,-170 170,76.262 170,170 -76.262,170 -170,170zM256,426"/>
+    <path android:fillColor="#000" android:pathData="m324.18,187.82c-5.859,-5.855 -15.355,-5.855 -21.215,0l-46.965,46.965 -46.965,-46.965c-5.859,-5.855 -15.355,-5.855 -21.215,0 -5.855,5.859 -5.855,15.355 0,21.215l46.965,46.965 -46.965,46.965c-5.855,5.859 -5.855,15.355 0,21.215 2.93,2.93 6.77,4.395 10.605,4.395 3.84,0 7.68,-1.465 10.605,-4.395l46.969,-46.965 46.965,46.965c2.93,2.93 6.77,4.395 10.605,4.395 3.84,0 7.68,-1.465 10.609,-4.395 5.855,-5.859 5.855,-15.355 0,-21.215l-46.965,-46.965 46.965,-46.965c5.855,-5.859 5.855,-15.355 0,-21.215zM324.18,187.82"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_gaana.xml b/common/compose-ui/src/main/res/drawable/ic_gaana.xml
new file mode 100644
index 00000000..28d27c3c
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_gaana.xml
@@ -0,0 +1,32 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector android:height="42dp" android:viewportHeight="200"
+    android:viewportWidth="200" android:width="42dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <group>
+        <clip-path android:pathData="M100,100m-100,0a100,100 0,1 1,200 0a100,100 0,1 1,-200 0"/>
+        <path android:fillColor="#E62C28" android:pathData="M202.7,195.2c0,0.3 -0.1,0.8 -0.1,1.1c-1.5,3 -3.7,5.3 -6.9,6.4c-0.2,0 -0.4,0 -0.6,0.1c-0.8,-0.1 -1.6,-0.4 -2.3,-0.4c-61,0 -122.1,0 -183.1,0c-0.7,0 -1.4,0.3 -2.1,0.4c-0.3,0 -0.7,-0.1 -1,-0.1c-3,-1.4 -5.2,-3.6 -6.5,-6.6V6.7c1.3,-3.1 3.5,-5.3 6.6,-6.7C6.8,0 7,0 7.2,0c0.9,0.1 1.7,0.4 2.6,0.4c61,0 122.1,0 183.1,0c0.8,0 1.5,-0.2 2.3,-0.4c0.2,0 0.4,0 0.5,0c3.4,1.2 5.7,3.5 6.9,7c0,0.1 0,0.4 0,0.5c-0.1,0.7 -0.4,1.4 -0.4,2.1c0,61.2 0,122.3 0,183.5C202.3,193.8 202.6,194.5 202.7,195.2zM52.3,178.7c0.9,0 1.6,0 2.3,0c11.3,0 22.6,0.1 33.8,0c2.9,0 6,-0.3 8.8,-0.9c15.9,-3.4 26.8,-12.6 30.8,-28.7c1.8,-7.3 2.8,-14.9 4.1,-22.3c5.5,-31.1 11,-62.2 16.4,-93.2c0.5,-3.1 1.1,-6.1 1.6,-9.4c-1,0 -1.8,0 -2.5,0c-13.4,0 -26.8,-0.1 -40.2,0c-2.9,0 -6,0.3 -8.8,0.9C82,28.6 71.1,38.5 67.6,55.6c-2.1,10 -3.7,20.1 -5.4,30.1c-1.2,6.9 -2.6,13.9 -3.2,20.9c-0.9,10.1 2.7,18.4 11.9,23.6c3.9,2.2 8.2,3.7 12.7,3.9c7.7,0.3 15.4,0.3 23.1,0.4c0.7,0 1.4,0 2.2,0c-0.7,3.6 -1.3,6.8 -1.9,10c-1.6,8.3 -6.1,12.1 -14.5,12.1c-11.3,0 -22.6,0 -33.8,0c-0.8,0 -1.5,0 -2.3,0C54.9,164.1 53.7,171.2 52.3,178.7z"/>
+        <path android:fillColor="#E94845" android:pathData="M195.2,0c-0.8,0.1 -1.5,0.4 -2.3,0.4c-61,0 -122.1,0 -183.1,0C9,0.4 8.3,0.1 7.5,0C70.1,0 132.6,0 195.2,0z"/>
+        <path android:fillColor="#E94845" android:pathData="M202.7,195.2c-0.1,-0.7 -0.4,-1.4 -0.4,-2.1c0,-61.2 0,-122.3 0,-183.5c0,-0.7 0.2,-1.4 0.4,-2.1C202.7,70.1 202.7,132.6 202.7,195.2z"/>
+        <path android:fillColor="#E94845" android:pathData="M7.5,202.7c0.7,-0.1 1.4,-0.4 2.1,-0.4c61,0 122.1,0 183.1,0c0.7,0 1.4,0.3 2.1,0.4C132.4,202.7 69.9,202.7 7.5,202.7z"/>
+        <path android:fillColor="#FDFCFC" android:pathData="M202.7,7.1c-1.2,-3.5 -3.6,-5.9 -7.1,-7.1h7.1V7.1z"/>
+        <path android:fillColor="#FDFCFC" android:pathData="M195.6,202.7c3.4,-1.2 5.7,-3.5 7.1,-6.7v6.7H195.6z"/>
+        <path android:fillColor="#FDFCFC" android:pathData="M0,196c1.3,3.1 3.6,5.3 6.7,6.7H0V196z"/>
+        <path android:fillColor="#FDFCFC" android:pathData="M6.7,0C3.6,1.4 1.3,3.6 0,6.7V0H6.7z"/>
+        <path android:fillColor="#FDFCFC" android:pathData="M52.3,178.7c1.3,-7.4 2.6,-14.6 4,-22c0.8,0 1.6,0 2.3,0c11.3,0 22.6,0 33.8,0c8.4,0 12.9,-3.8 14.5,-12.1c0.6,-3.2 1.2,-6.5 1.9,-10c-0.8,0 -1.5,0 -2.2,0c-7.7,-0.1 -15.4,0 -23.1,-0.4c-4.5,-0.2 -8.8,-1.7 -12.7,-3.9c-9.2,-5.2 -12.8,-13.5 -11.9,-23.6c0.6,-7 2,-13.9 3.2,-20.9c1.7,-10.1 3.4,-20.2 5.4,-30.1C71.1,38.5 82,28.6 98.8,25c2.9,-0.6 5.9,-0.9 8.8,-0.9c13.4,-0.1 26.8,0 40.2,0c0.7,0 1.4,0 2.5,0c-0.6,3.3 -1.1,6.3 -1.6,9.4c-5.5,31.1 -11,62.2 -16.4,93.2c-1.3,7.5 -2.3,15 -4.1,22.3c-4,16.1 -14.9,25.3 -30.8,28.7c-2.9,0.6 -5.9,0.9 -8.8,0.9c-11.3,0.1 -22.6,0 -33.8,0C53.9,178.7 53.2,178.7 52.3,178.7zM112.7,112.4c1.2,-6.8 2.4,-13.4 3.5,-20c2.1,-12.1 4.3,-24.3 6.3,-36.4c0.8,-4.6 -1.4,-8 -5.9,-9.3c-1.3,-0.4 -2.7,-0.5 -4.1,-0.5c-3,-0.1 -5.9,0 -8.9,0c-8.2,0 -13.2,4.4 -14.5,12.4c-0.8,4.9 -1.7,9.7 -2.6,14.6c-1.7,9.6 -3.5,19.2 -5,28.8c-0.9,6 2.1,10 8.2,10.3C97.3,112.6 104.9,112.4 112.7,112.4z"/>
+        <path android:fillColor="#E62D29" android:pathData="M112.7,112.4c-7.8,0 -15.3,0.3 -22.9,-0.1c-6.1,-0.3 -9.2,-4.3 -8.2,-10.3c1.5,-9.6 3.3,-19.2 5,-28.8c0.8,-4.9 1.8,-9.7 2.6,-14.6c1.3,-8 6.3,-12.4 14.5,-12.4c3,0 5.9,-0.1 8.9,0c1.4,0 2.8,0.2 4.1,0.5c4.5,1.3 6.7,4.7 5.9,9.3c-2.1,12.1 -4.2,24.3 -6.3,36.4C115,98.9 113.9,105.5 112.7,112.4z"/>
+    </group>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_heart.xml b/common/compose-ui/src/main/res/drawable/ic_heart.xml
new file mode 100644
index 00000000..92f9beb0
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_heart.xml
@@ -0,0 +1,24 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="25dp"
+    android:height="25dp" android:viewportWidth="512.007" android:viewportHeight="512.007">
+    <path android:fillColor="#fe646f" android:pathData="m380.125,59.036c-59.77,0 -109.664,42.249 -121.469,98.51 -0.608,2.899 -4.703,2.901 -5.312,0 -11.805,-56.261 -61.699,-98.51 -121.469,-98.51 -114.106,0 -167.756,141.01 -82.508,216.858l193.339,172.02c7.58,6.744 19.009,6.744 26.589,0l193.339,-172.02c85.248,-75.848 31.598,-216.858 -82.509,-216.858z"/>
+    <path android:fillColor="#fd4755" android:pathData="m380.125,59.036c-6.912,0 -13.689,0.572 -20.293,1.658 99.376,15.991 141.363,144.168 61.527,215.2l-185.996,165.487 7.343,6.533c7.58,6.744 19.009,6.744 26.589,0l193.339,-172.02c85.248,-75.848 31.598,-216.858 -82.509,-216.858z"/>
+    <path android:fillColor="#fe646f" android:pathData="m380.125,59.036c-59.77,0 -109.664,42.249 -121.469,98.51 -0.608,2.899 -4.703,2.901 -5.312,0 -11.805,-56.261 -61.699,-98.51 -121.469,-98.51 -114.106,0 -167.756,141.01 -82.508,216.858l193.339,172.02c7.58,6.744 19.009,6.744 26.589,0l193.339,-172.02c85.248,-75.848 31.598,-216.858 -82.509,-216.858z"/>
+    <path android:fillColor="#fd4755" android:pathData="m380.125,59.036c-6.912,0 -13.689,0.572 -20.293,1.658 99.376,15.991 141.363,144.168 61.527,215.2l-185.996,165.487 7.343,6.533c7.58,6.744 19.009,6.744 26.589,0l193.339,-172.02c85.248,-75.848 31.598,-216.858 -82.509,-216.858z"/>
+    <path android:fillColor="#FF000000" android:pathData="m237.72,453.517c-204.315,-181.786 -197.402,-175.776 -197.402,-175.776 -25.999,-24.984 -40.318,-58.201 -40.318,-93.533 0,-46.48 24.63,-91.702 65.906,-115.47 3.589,-2.067 8.174,-0.833 10.242,2.757 2.067,3.589 0.833,8.175 -2.757,10.242 -36.017,20.74 -58.391,60.004 -58.391,102.471 0,31.212 12.683,60.588 35.711,82.717 0,0 -6.881,-5.996 196.979,175.386 2.292,2.039 5.242,3.161 8.309,3.161 3.066,0 6.018,-1.123 8.31,-3.162l61.917,-55.089c3.095,-2.753 7.835,-2.477 10.588,0.618s2.477,7.835 -0.618,10.588l-61.917,55.09c-10.431,9.281 -26.148,9.263 -36.559,0zM357.363,377.059c-2.067,0 -4.124,-0.849 -5.606,-2.515 -2.753,-3.095 -2.477,-7.835 0.618,-10.588l105.273,-93.665c21.815,-19.409 35.132,-44.369 38.513,-72.181 0.001,-0.006 0.001,-0.012 0.002,-0.018 7.637,-62.927 -37.915,-131.557 -116.038,-131.557 -54.879,0 -102.877,38.923 -114.129,92.55 -1.005,4.79 -5.116,8.135 -9.997,8.135s-8.991,-3.346 -9.996,-8.136c-11.252,-53.626 -59.25,-92.549 -114.128,-92.549 -9.633,0 -19.082,1.076 -28.084,3.198 -4.033,0.952 -8.07,-1.548 -9.021,-5.579 -0.951,-4.032 1.547,-8.07 5.579,-9.021 10.128,-2.388 20.735,-3.598 31.525,-3.598 55.699,0 105.463,35.109 124.125,87.792 18.71,-52.817 68.567,-87.792 124.125,-87.792 84.905,0 139.884,74.56 130.929,148.362 0,0.007 -0.001,0.015 -0.002,0.022 -3.829,31.494 -18.847,59.703 -43.433,81.578l-105.273,93.665c-1.429,1.272 -3.209,1.897 -4.982,1.897z"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_spotiflyer_logo.xml b/common/compose-ui/src/main/res/drawable/ic_spotiflyer_logo.xml
new file mode 100644
index 00000000..bc68c3c7
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_spotiflyer_logo.xml
@@ -0,0 +1,47 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector android:height="150dp" android:viewportHeight="512"
+    android:viewportWidth="512" android:width="150dp"
+    xmlns:aapt="http://schemas.android.com/aapt" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:pathData="M256,256m-256,0a256,256 0,1 1,512 0a256,256 0,1 1,-512 0">
+        <aapt:attr name="android:fillColor">
+            <gradient android:endX="437.019" android:endY="74.981"
+                android:startX="74.981" android:startY="437.019" android:type="linear">
+                <item android:color="#FF736BFD" android:offset="0"/>
+                <item android:color="#FFF54187" android:offset="1"/>
+            </gradient>
+        </aapt:attr>
+    </path>
+    <path android:fillColor="#FF000000" android:pathData="M377,356.7c-68.9,-45.4 -155.6,-56.4 -257.6,-32.7c-20.5,4.8 -13.6,35.8 7.3,31.2C290.7,317 351.6,386 368.2,386C384,386 390.2,365.4 377,356.7z"/>
+    <path android:fillColor="#FF000000" android:pathData="M112.1,275.1C203.9,253.4 308.1,266 384,308c18.5,10.2 34,-17.8 15.5,-28c-82.7,-45.7 -195.6,-59.5 -294.7,-36C84.2,248.8 91.5,280 112.1,275.1L112.1,275.1z"/>
+    <path android:fillColor="#FF000000" android:pathData="M100,191.9c96.6,-29.6 232.2,-13.4 308.7,36.9c17.6,11.5 35.3,-15.1 17.6,-26.7c-84.9,-55.8 -229.2,-73.3 -335.6,-40.8C70.4,167.5 79.9,198.1 100,191.9L100,191.9z"/>
+    <path android:pathData="M507.8,438.2c-1.6,97.2 -141.9,97.1 -143.5,0C365.9,341 506.2,341 507.8,438.2z">
+        <aapt:attr name="android:fillColor">
+            <gradient android:endX="384.197" android:endY="490.009"
+                android:startX="487.832" android:startY="386.374" android:type="linear">
+                <item android:color="#FF736BFD" android:offset="0"/>
+                <item android:color="#FFF54187" android:offset="1"/>
+            </gradient>
+        </aapt:attr>
+    </path>
+    <path android:fillColor="#FF000000"
+        android:pathData="M486.8,456.8c-0.6,-2.4 -6.9,-1 -8.5,-1.4c11.5,-82 -82.4,-86.7 -87.1,-22.2c0.3,1.8 -1,6.7 2.2,6.6c0,0 8.6,0 8.6,0c3.1,0.1 2,-4.7 2.2,-6.6c0.1,-23.3 35,-23.3 35.2,0c0,0 0,6.9 0,6.9c-0.1,2.8 4.4,2.8 4.3,0c5,-35.2 -43.8,-40.1 -43.8,-4.7h-4.3c-1.6,-53.7 77.2,-55.9 78.4,-2.2c0,0 0,24.4 0,24.4c-0.1,2.9 3.8,2.1 5.6,2.2l-20.7,21l-20.7,-21c1.8,-0.1 5.6,0.7 5.6,-2.2c0,0 0,-8.8 0,-8.8c0,-2.8 -4.4,-2.8 -4.3,0c0,0 0,6.6 0,6.6c-2.2,0.2 -11.3,-1.3 -8,3.7c0,0 25.9,26.3 25.9,26.3c0.8,0.9 2.2,0.9 3.1,0C460.6,484.4 489.4,458.3 486.8,456.8z"
+        android:strokeColor="#000" android:strokeWidth=".75"/>
+    <path android:fillColor="#00000000"
+        android:pathData="M510,437.5c-1.7,96.2 -142.1,96.2 -143.8,0C367.9,341.3 508.4,341.3 510,437.5z"
+        android:strokeColor="#000" android:strokeWidth="6"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_spotify_logo.xml b/common/compose-ui/src/main/res/drawable/ic_spotify_logo.xml
new file mode 100644
index 00000000..e773449a
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_spotify_logo.xml
@@ -0,0 +1,20 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:width="42dp"
+    android:height="42dp" android:viewportWidth="427.652" android:viewportHeight="427.652">
+    <path android:fillColor="#00D95F" android:pathData="M213.826,0C95.733,0 0,95.733 0,213.826s95.733,213.826 213.826,213.826s213.826,-95.733 213.826,-213.826S331.919,0 213.826,0zM306.886,310.32c-2.719,4.652 -7.612,7.246 -12.638,7.247c-2.506,0 -5.044,-0.645 -7.364,-2c-38.425,-22.456 -82.815,-26.065 -113.295,-25.138c-33.763,1.027 -58.523,7.692 -58.769,7.76c-7.783,2.126 -15.826,-2.454 -17.961,-10.236c-2.134,-7.781 2.43,-15.819 10.209,-17.962c1.116,-0.307 27.76,-7.544 64.811,-8.766c21.824,-0.72 42.834,0.801 62.438,4.52c24.83,4.71 47.48,12.978 67.322,24.574C308.612,294.393 310.96,303.349 306.886,310.32zM334.07,253.861c-3.22,5.511 -9.016,8.583 -14.97,8.584c-2.968,0 -5.975,-0.763 -8.723,-2.369c-45.514,-26.6 -98.097,-30.873 -134.2,-29.776c-39.994,1.217 -69.323,9.112 -69.614,9.192c-9.217,2.515 -18.746,-2.906 -21.275,-12.124c-2.528,-9.218 2.879,-18.738 12.093,-21.277c1.322,-0.364 32.882,-8.937 76.77,-10.384c25.853,-0.852 50.739,0.949 73.96,5.354c29.412,5.58 56.241,15.373 79.744,29.108C336.115,234.995 338.897,245.603 334.07,253.861zM350.781,202.526c-3.641,0 -7.329,-0.936 -10.7,-2.906c-108.207,-63.238 -248.572,-25.643 -249.977,-25.255c-11.313,3.117 -23.008,-3.527 -26.124,-14.839c-3.117,-11.312 3.527,-23.008 14.839,-26.124c1.621,-0.447 40.333,-10.962 94.166,-12.737c31.713,-1.044 62.237,1.164 90.72,6.567c36.077,6.844 68.987,18.856 97.815,35.704c10.13,5.92 13.543,18.931 7.623,29.061C365.193,198.757 358.084,202.526 350.781,202.526z"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_tick.xml b/common/compose-ui/src/main/res/drawable/ic_tick.xml
new file mode 100644
index 00000000..47903522
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_tick.xml
@@ -0,0 +1,30 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector xmlns:android="http://schemas.android.com/apk/res/android" xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="36dp" android:height="36dp"
+    android:viewportWidth="512" android:viewportHeight="512">
+    <path android:pathData="m512,256c0,141.387 -114.613,256 -256,256s-256,-114.613 -256,-256 114.613,-256 256,-256 256,114.613 256,256zM512,256">
+        <aapt:attr name="android:fillColor">
+            <gradient android:endX="512" android:endY="256"
+                android:startX="0" android:startY="256" android:type="linear">
+                <item android:color="#748AFF" android:offset="0"/>
+                <item android:color="#FF3C64" android:offset="1"/>
+            </gradient>
+        </aapt:attr>
+    </path>
+    <path android:fillColor="#000000" android:pathData="m175,395.246c-4.035,0 -7.902,-1.629 -10.727,-4.512l-81,-82.832c-5.789,-5.922 -5.684,-15.418 0.238,-21.211 5.922,-5.793 15.418,-5.688 21.211,0.238l70.273,71.859 232.277,-237.523c5.793,-5.922 15.289,-6.027 21.211,-0.234 5.926,5.789 6.031,15.289 0.238,21.211l-243,248.492c-2.82,2.883 -6.688,4.512 -10.723,4.512zM175,395.246"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_youtube.xml b/common/compose-ui/src/main/res/drawable/ic_youtube.xml
new file mode 100644
index 00000000..728779f1
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_youtube.xml
@@ -0,0 +1,23 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector android:height="42dp" android:viewportHeight="500"
+    android:viewportWidth="500" android:width="42dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="#E11F23" android:pathData="M236.966,236.966m-236.966,0a236.966,236.966 0,1 1,473.932 0a236.966,236.966 0,1 1,-473.932 0"/>
+    <path android:fillColor="#E11F23" android:pathData="M404.518,69.38c92.541,92.549 92.549,242.593 0,335.142c-92.541,92.541 -242.593,92.545 -335.142,0L404.518,69.38z"/>
+    <path android:fillColor="#E11F23" android:pathData="M469.168,284.426L351.886,167.148l-138.322,15.749l-83.669,129.532l156.342,156.338C378.157,449.322 450.422,376.612 469.168,284.426z"/>
+    <path android:fillColor="#FFFFFF" android:pathData="M360.971,191.238c0,-19.865 -16.093,-35.966 -35.947,-35.966H156.372c-19.85,0 -35.94,16.105 -35.94,35.966v96.444c0,19.865 16.093,35.966 35.94,35.966h168.649c19.858,0 35.947,-16.105 35.947,-35.966v-96.444H360.971zM216.64,280.146v-90.584l68.695,45.294L216.64,280.146z"/>
+</vector>
diff --git a/common/compose-ui/src/main/res/drawable/ic_youtube_music_logo.xml b/common/compose-ui/src/main/res/drawable/ic_youtube_music_logo.xml
new file mode 100644
index 00000000..7e723917
--- /dev/null
+++ b/common/compose-ui/src/main/res/drawable/ic_youtube_music_logo.xml
@@ -0,0 +1,22 @@
+<!--
+  ~ Copyright (c)  2021  Shabinder Singh
+  ~ This program is free software: you can redistribute it and/or modify
+  ~ it under the terms of the GNU General Public License as published by
+  ~ the Free Software Foundation, either version 3 of the License, or
+  ~ (at your option) any later version.
+  ~
+  ~ This program is distributed in the hope that it will be useful,
+  ~ but WITHOUT ANY WARRANTY; without even the implied warranty of
+  ~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+  ~ GNU General Public License for more details.
+  ~
+  ~  You should have received a copy of the GNU General Public License
+  ~  along with this program.  If not, see <https://www.gnu.org/licenses/>.
+  -->
+
+<vector android:height="44dp" android:viewportHeight="192"
+    android:viewportWidth="192" android:width="44dp" xmlns:android="http://schemas.android.com/apk/res/android">
+    <path android:fillColor="#FF0000" android:pathData="M96,96m-88,0a88,88 0,1 1,176 0a88,88 0,1 1,-176 0"/>
+    <path android:fillColor="#FFFFFF" android:pathData="M96,54.04c23.14,0 41.96,18.82 41.96,41.96S119.14,137.96 96,137.96S54.04,119.14 54.04,96S72.86,54.04 96,54.04M96,50c-25.41,0 -46,20.59 -46,46s20.59,46 46,46s46,-20.59 46,-46S121.41,50 96,50L96,50z"/>
+    <path android:fillColor="#FFFFFF" android:pathData="M80,119l39,-24l-39,-22z"/>
+</vector>
diff --git a/common/dependency-injection/src/commonMain/kotlin/com/shabinder/common/Dir.kt b/common/dependency-injection/src/commonMain/kotlin/com/shabinder/common/Dir.kt
index 4035cb1e..9c113a93 100644
--- a/common/dependency-injection/src/commonMain/kotlin/com/shabinder/common/Dir.kt
+++ b/common/dependency-injection/src/commonMain/kotlin/com/shabinder/common/Dir.kt
@@ -17,7 +17,7 @@ expect open class Dir(
     fun defaultDir(): String
     fun imageCacheDir(): String
     fun createDirectory(dirPath:String)
-    fun cacheImage(picture: Picture)
+    suspend fun cacheImage(picture: Picture)
     fun loadImage(url:String, cachePath:String = imageCacheDir() + getNameURL(url)):Picture?
     suspend fun clearCache()
     suspend fun saveFileWithMetadata(mp3ByteArray: ByteArray, path: String, trackDetails: TrackDetails)
diff --git a/common/dependency-injection/src/desktopMain/kotlin/com/shabinder/common/Dir.kt b/common/dependency-injection/src/desktopMain/kotlin/com/shabinder/common/Dir.kt
index 3ddccbe4..8d4e8775 100644
--- a/common/dependency-injection/src/desktopMain/kotlin/com/shabinder/common/Dir.kt
+++ b/common/dependency-injection/src/desktopMain/kotlin/com/shabinder/common/Dir.kt
@@ -2,6 +2,9 @@ package com.shabinder.common
 
 import co.touchlab.kermit.Kermit
 import com.mpatric.mp3agic.Mp3File
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.GlobalScope
+import kotlinx.coroutines.launch
 import java.awt.image.BufferedImage
 import java.io.*
 import java.lang.Exception
@@ -43,7 +46,7 @@ actual open class Dir actual constructor(private val logger: Kermit) {
         File(imageCacheDir()).deleteRecursively()
     }
 
-    actual fun cacheImage(picture: Picture) {
+    actual suspend fun cacheImage(picture: Picture) {
         try {
             val path = imageCacheDir() + picture.name
 
@@ -137,8 +140,9 @@ actual open class Dir actual constructor(private val logger: Kermit) {
                     result.width,
                     result.height
                 )
-
-                cacheImage(picture)
+                GlobalScope.launch(Dispatchers.IO) { //TODO Refactor
+                    cacheImage(picture)
+                }
                 picture
             } else null
         } catch (e: Exception) {