diff --git a/assets/js/dashboard/stats/devices/index.js b/assets/js/dashboard/stats/devices/index.js
index 7fd8ec58e2ce..5f861040cd1d 100644
--- a/assets/js/dashboard/stats/devices/index.js
+++ b/assets/js/dashboard/stats/devices/index.js
@@ -103,7 +103,37 @@ function BrowserVersions({ query, site, afterFetchData }) {
query={query}
/>
)
+}
+// Icons copied from https://github.com/ngeenx/operating-system-logos
+const OS_ICONS = {
+ 'iOS': 'ios.png',
+ 'Mac': 'mac.png',
+ 'Windows': 'windows.png',
+ 'Windows Phone': 'windows.png',
+ 'Android': 'android.png',
+ 'GNU/Linux': 'gnu_linux.png',
+ 'Ubuntu': 'ubuntu.png',
+ 'Chrome OS': 'chrome_os.png',
+ 'iPadOS': 'ipad_os.png',
+ 'Fire OS': 'fire_os.png',
+ 'HarmonyOS': 'harmony_os.png',
+ 'Tizen': 'tizen.png',
+ 'PlayStation': 'playstation.png',
+ 'KaiOS': 'kai_os.png',
+ 'Fedora': 'fedora.png',
+ 'FreeBSD': 'freebsd.png',
+}
+
+function osIconFor(os) {
+ const filename = OS_ICONS[os] || 'fallback.svg'
+
+ return (
+
+ )
}
function OperatingSystems({ query, site, afterFetchData }) {
@@ -118,11 +148,16 @@ function OperatingSystems({ query, site, afterFetchData }) {
}
}
+ function renderIcon(listItem) {
+ return osIconFor(listItem.name)
+ }
+
return (
{
+ return {...res, results: res.results.map((row => {
+ return {...row, name: `${row.os} ${row.name}`, version: row.name}
+ }))}
+ })
+ }
+
+ function renderIcon(listItem) {
+ return osIconFor(listItem.os)
}
function getFilterFor(listItem) {
@@ -141,13 +185,14 @@ function OperatingSystemVersions({ query, site, afterFetchData }) {
}
return {
prefix: 'os_version',
- filter: ["is", "os_version", [listItem['name']]]
+ filter: ["is", "os_version", [listItem.version]]
}
}
return (
+
+
diff --git a/priv/static/images/icon/os/fedora.png b/priv/static/images/icon/os/fedora.png
new file mode 100644
index 000000000000..6c689600257b
Binary files /dev/null and b/priv/static/images/icon/os/fedora.png differ
diff --git a/priv/static/images/icon/os/fire_os.png b/priv/static/images/icon/os/fire_os.png
new file mode 100644
index 000000000000..9936154d5df9
Binary files /dev/null and b/priv/static/images/icon/os/fire_os.png differ
diff --git a/priv/static/images/icon/os/freebsd.png b/priv/static/images/icon/os/freebsd.png
new file mode 100644
index 000000000000..a330ab244632
Binary files /dev/null and b/priv/static/images/icon/os/freebsd.png differ
diff --git a/priv/static/images/icon/os/gnu_linux.png b/priv/static/images/icon/os/gnu_linux.png
new file mode 100644
index 000000000000..37358e00d612
Binary files /dev/null and b/priv/static/images/icon/os/gnu_linux.png differ
diff --git a/priv/static/images/icon/os/harmony_os.png b/priv/static/images/icon/os/harmony_os.png
new file mode 100644
index 000000000000..f680636558be
Binary files /dev/null and b/priv/static/images/icon/os/harmony_os.png differ
diff --git a/priv/static/images/icon/os/ios.png b/priv/static/images/icon/os/ios.png
new file mode 100644
index 000000000000..77f6d153fc0e
Binary files /dev/null and b/priv/static/images/icon/os/ios.png differ
diff --git a/priv/static/images/icon/os/ipad_os.png b/priv/static/images/icon/os/ipad_os.png
new file mode 100644
index 000000000000..42402ad2bc85
Binary files /dev/null and b/priv/static/images/icon/os/ipad_os.png differ
diff --git a/priv/static/images/icon/os/kai_os.png b/priv/static/images/icon/os/kai_os.png
new file mode 100644
index 000000000000..cbcf492eb2b4
Binary files /dev/null and b/priv/static/images/icon/os/kai_os.png differ
diff --git a/priv/static/images/icon/os/mac.png b/priv/static/images/icon/os/mac.png
new file mode 100644
index 000000000000..8e821f935bfc
Binary files /dev/null and b/priv/static/images/icon/os/mac.png differ
diff --git a/priv/static/images/icon/os/playstation.png b/priv/static/images/icon/os/playstation.png
new file mode 100644
index 000000000000..22c468d59b95
Binary files /dev/null and b/priv/static/images/icon/os/playstation.png differ
diff --git a/priv/static/images/icon/os/tizen.png b/priv/static/images/icon/os/tizen.png
new file mode 100644
index 000000000000..f32b415f7129
Binary files /dev/null and b/priv/static/images/icon/os/tizen.png differ
diff --git a/priv/static/images/icon/os/ubuntu.png b/priv/static/images/icon/os/ubuntu.png
new file mode 100644
index 000000000000..6878759aa8ee
Binary files /dev/null and b/priv/static/images/icon/os/ubuntu.png differ
diff --git a/priv/static/images/icon/os/windows.png b/priv/static/images/icon/os/windows.png
new file mode 100644
index 000000000000..2451fb16d2f1
Binary files /dev/null and b/priv/static/images/icon/os/windows.png differ