From 1f943a7d690eb52ed9255ad528d0dab46abf2169 Mon Sep 17 00:00:00 2001
From: Hassan Malik <41640681+hmalik88@users.noreply.github.com>
Date: Sat, 23 Jul 2022 00:58:46 -0400
Subject: [PATCH] [FLASK] Fix snaps authorship pill (#15190)

* add truncation

* add title to show complete package name

* Remove hardcoded max-width

* truncation

* reduced max-width

* final changes

Co-authored-by: Frederik Bolding <frederik.bolding@gmail.com>
Co-authored-by: eriknson <eriks@mail.se>
---
 ui/components/app/flask/snaps-authorship-pill/index.scss  | 8 ++++++++
 .../flask/snaps-authorship-pill/snaps-authorship-pill.js  | 1 +
 2 files changed, 9 insertions(+)

diff --git a/ui/components/app/flask/snaps-authorship-pill/index.scss b/ui/components/app/flask/snaps-authorship-pill/index.scss
index 90f4fa21b..1d6b6b3a9 100644
--- a/ui/components/app/flask/snaps-authorship-pill/index.scss
+++ b/ui/components/app/flask/snaps-authorship-pill/index.scss
@@ -5,6 +5,14 @@
 
   .chip {
     padding-right: 8px;
+    margin-top: 4px;
+  }
+
+  .chip__label {
+    max-width: 168px;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
   }
 
   &:hover,
diff --git a/ui/components/app/flask/snaps-authorship-pill/snaps-authorship-pill.js b/ui/components/app/flask/snaps-authorship-pill/snaps-authorship-pill.js
index 81eb07e1b..c6846a052 100644
--- a/ui/components/app/flask/snaps-authorship-pill/snaps-authorship-pill.js
+++ b/ui/components/app/flask/snaps-authorship-pill/snaps-authorship-pill.js
@@ -63,6 +63,7 @@ const SnapsAuthorshipPill = ({ snapId, version, className }) => {
           variant={TYPOGRAPHY.H7}
           tag="span"
           color={COLORS.TEXT_ALTERNATIVE}
+          title={packageName}
         >
           {packageName}
         </Typography>