fix(share): force share image to be square (to fix aspect ratio) (#4122)

* fix(ui): update artist link rendering and improve button styles

Signed-off-by: Deluan <deluan@navidrome.org>

* square share player

---------

Signed-off-by: Deluan <deluan@navidrome.org>
Co-authored-by: Deluan <deluan@navidrome.org>

ui/src/share/SharePlayer.jsx

@@ -29,7 +29,7 @@ const SharePlayer = () => {
     return {
       name: s.title,
       musicSrc: shareStreamUrl(s.id),
-      cover: shareCoverUrl(s.id),
+      cover: shareCoverUrl(s.id, true),
       singer: s.artist,
       duration: s.duration,
     }

ui/src/utils/urls.js

@@ -33,8 +33,14 @@ export const shareDownloadUrl = (id) => {
   return shareUrl(config.publicBaseUrl + '/d/' + id)
 }
 
-export const shareCoverUrl = (id) => {
-  return shareUrl(config.publicBaseUrl + '/img/' + id + '?size=300')
+export const shareCoverUrl = (id, square) => {
+  return shareUrl(
+    config.publicBaseUrl +
+      '/img/' +
+      id +
+      '?size=300' +
+      (square ? '&square=true' : ''),
+  )
 }
 
 export const docsUrl = (path) => `https://www.navidrome.org${path}`