Code cleanups as per feedback

MozillaFoundation · Oct 21, 2021 · 03ceb29 · 03ceb29
1 parent 17dc691
commit 03ceb29
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 9 deletions.
diff --git a/source/js/components/pulse-profile/pulse-profile.jsx b/source/js/components/pulse-profile/pulse-profile.jsx
@@ -1,8 +1,9 @@
 import React from "react";
 
 const PulseProfile = ({ profile }) => {
+ const profileUrl = "https://www.mozillapulse.org/profile/";
  return (
- <div className="tw-grid tw-grid-cols-4  tw-gap-x-3 tw-gap-y-2 tw-border-t tw-border-black">
+ <div className="tw-grid tw-grid-cols-4 tw-gap-x-3 tw-gap-y-2 tw-border-t tw-border-black">
  {/* Image */}
  <a
  href={`https://www.mozillapulse.org/profile/${profile.profile_id}`}
@@ -21,12 +22,11 @@ const PulseProfile = ({ profile }) => {
 
  {/* Right card */}
  <div className="tw-col-start-2 tw-col-span-3 tw-flex tw-flex-col">
-
  {/* Card top */}
  <div className="tw-flex tw-flex-row tw-justify-between tw-items-center tw-mt-2">
  <a
  className="tw-text-lg tw-mb-1 tw-font-sans tw-font-normal tw-text-black"
- href={`https://www.mozillapulse.org/profile/${profile.profile_id}`}
+ href={`${profileUrl}${profile.profile_id}`}
  >
  {profile.name}
  </a>
@@ -61,9 +61,11 @@ const PulseProfile = ({ profile }) => {
  )}
 
  {/* Short bio block */}
- {profile.user_bio &&
- <p className="tw-text-gray-60 tw-text-sm medium:tw-text-[15px] my-2">{profile.user_bio}</p>
- }
+ {profile.user_bio && (
+ <p className="tw-text-gray-60 tw-text-sm medium:tw-text-[15px] my-2">
+ {profile.user_bio}
+ </p>
+ )}
 
  {profile.program_type && (
  <div className="tw-flex tw-flex-wrap tw-mt-auto">

diff --git a/source/js/components/tabbed-profile-directory/loading-spinner.jsx b/source/js/components/tabbed-profile-directory/loading-spinner.jsx
@@ -1,7 +1,12 @@
+import { getText } from "./locales";
+
 const LoadingSpinner = () => {
  return (
- <div className="col-12 mx-auto my-5 text-center">
- <div className="loading-indicator d-inline-block">
+ <div
+ className="col-12 mx-auto my-5 text-center"
+ aria-label={getText("Loading Icon")}
+ >
+ <div className="loading-indicator d-inline-block" aria-hidden="true">
  <div className="dot" />
  <div className="dot" />
  <div className="dot" />

diff --git a/source/js/components/tabbed-profile-directory/locale-strings.jsx b/source/js/components/tabbed-profile-directory/locale-strings.jsx
@@ -2,31 +2,43 @@ export default {
  // English
  en: {
  "No Profiles": `No profiles found. Please try again.`,
+ "Loading Icon": `No profiles found. Please try again.`,
+ "Filter by": `Filter by`,
  "Show All": `All`,
  },
  // German
  de: {
  "No Profiles": `Keine Profile gefunden. Bitte versuche es erneut.`,
+ "Loading Icon": `Ladesymbol`,
+ "Filter by": `Filtern nach`,
  "Show All": `Alle`,
  },
  // Spanish
  es: {
  "No Profiles": `No se encontraron perfiles. Inténtalo de nuevo.`,
+ "Loading Icon": `Cargando icono`,
+ "Filter by": `filtrado por`,
  "Show All": `Todos`,
  },
  // French
  fr: {
  "No Profiles": `Aucun profil trouvé. Veuillez réessayer.`,
+ "Loading Icon": `Icône de chargement`,
+ "Filter by": `filtrer par`,
  "Show All": `Tout`,
  },
  // Polish
  pl: {
  "No Profiles": `Nie znaleziono profili. Proszę spróbuj ponownie.`,
+ "Loading Icon": `Ikona ładowania`,
+ "Filter by": `Filtruj według`,
  "Show All": `Wszystko`,
  },
  // Portuguese
  "pt-BR": {
  "No Profiles": `Nenhum perfil encontrado. Por favor, tente novamente.`,
+ "Loading Icon": `Carregando ícone`,
+ "Filter by": `filtrar por`,
  "Show All": `Tudo`,
  },
 };
diff --git a/source/js/components/tabbed-profile-directory/subfilter-dropdown.jsx b/source/js/components/tabbed-profile-directory/subfilter-dropdown.jsx
@@ -43,7 +43,10 @@ const SubfilterDropdown = ({
  aria-expanded={dropdownExpanded}
  aria-haspopup="listbox"
  >
- <span>Filter By {label}</span>
+ <span>
+ {getText("Filter by ")}
+ {label}
+ </span>
  <img
  className={`tw-w-4 tw-h-4 tw-ml-2 ${
  dropdownExpanded ? "tw-rotate-180" : ""