Achievements plugin: add option to change display style (#473)

source/plugins/achievements/README.md

@@ -5,6 +5,9 @@ The *achievements* plugin displays several highlights about what you achieved on
 <table>
   <td align="center">
     <img src="https://github.com/lowlighter/lowlighter/blob/master/metrics.plugin.achievements.svg">
+    <details><summary>Compact display</summary>
+      <img src="https://github.com/lowlighter/lowlighter/blob/master/metrics.plugin.achievements.compact.svg">
+    </details>
     <img width="900" height="1" alt="">
   </td>
 </table>
@@ -35,4 +38,5 @@ It also lets you quickly see at a glance what this user primarly use GitHub for,
     plugin_achievements_secrets: yes       # Display unlocked secrets achievements
     plugin_achievements_ignored: octonaut  # Hide octonaut achievement
     plugin_achievements_limit: 0           # Display all unlocked achievement matching threshold and secrets params
+    plugin_achievements_display: compact   # Use compact display
 ```

source/plugins/achievements/index.mjs

@@ -10,7 +10,7 @@ export default async function({login, q, imports, data, computed, graphql, queri
       return null
 
     //Load inputs
-    let {threshold, secrets, only, ignored, limit} = imports.metadata.plugins.achievements.inputs({data, q, account})
+    let {threshold, secrets, only, ignored, limit, display} = imports.metadata.plugins.achievements.inputs({data, q, account})
 
     //Initialization
     const list = []
@@ -26,13 +26,14 @@ export default async function({login, q, imports, data, computed, graphql, queri
       .filter(a => !ignored.includes(a.title.toLocaleLowerCase()))
       .sort((a, b) => (order[b.rank] + b.progress * 0.99) - (order[a.rank] + a.progress * 0.99))
       .map(({title, unlock, ...achievement}) => ({
-        title:({S:`Master ${title.toLocaleLowerCase()}`, A:`Super ${title.toLocaleLowerCase()}`, B:`Great ${title.toLocaleLowerCase()}`}[achievement.rank] ?? title),
+        prefix:({S:"Master", A:"Super", B:"Great"}[achievement.rank] ?? ""),
+        title,
         unlock:!/invalid date/i.test(unlock) ? `${imports.format.date(unlock, {timeStyle:"short"})} on ${imports.format.date(unlock, {dateStyle:"short"})}` : null,
         ...achievement,
       }))
       .map(({icon, ...achievement}) => ({icon:icon.replace(/#primary/g, colors[achievement.rank][0]).replace(/#secondary/g, colors[achievement.rank][1]), ...achievement}))
       .slice(0, limit || Infinity)
-    return {list:achievements}
+    return {list:achievements, display}
   }
   //Handle errors
   catch (error) {

source/plugins/achievements/metadata.yml

@@ -31,6 +31,15 @@ inputs:
     type: boolean
     default: yes
 
+  # Achievements display style
+  plugin_achievements_display:
+    description: Achievements display style
+    type: string
+    default: normal
+    values:
+      - normal   # Normal display
+      - compact  # Compact display (only icon, name and value are displayed)
+
   # Number of achievements events to display
   # Set to 0 to disable limitations
   plugin_achievements_limit: