From 7cf8dcc6fb76a1551291014d4811a1640f416d6a Mon Sep 17 00:00:00 2001 From: Harmit Goswami Date: Wed, 22 Jan 2025 13:41:32 -0500 Subject: [PATCH 1/3] Renamed status banner to user banner in css --- .../src/modules/user/components/UserAvatar.css | 14 +++++++------- .../src/modules/user/components/UserAvatar.tsx | 2 +- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/translate/src/modules/user/components/UserAvatar.css b/translate/src/modules/user/components/UserAvatar.css index 0789731ac..98868c33b 100644 --- a/translate/src/modules/user/components/UserAvatar.css +++ b/translate/src/modules/user/components/UserAvatar.css @@ -18,7 +18,7 @@ display: inline-block; } -.user-avatar .avatar-container .user-status-banner { +.user-avatar .avatar-container .user-banner { position: absolute; bottom: 0; left: 50%; @@ -34,26 +34,26 @@ white-space: nowrap; } -.comment .user-avatar .avatar-container .user-status-banner { +.comment .user-avatar .avatar-container .user-banner { font-size: 7px; } -.user-avatar .avatar-container .user-status-banner.ADMIN { +.user-avatar .avatar-container .user-banner.ADMIN { color: var(--user-admin); } -.user-avatar .avatar-container .user-status-banner.PM { +.user-avatar .avatar-container .user-banner.PM { color: var(--user-pm); } -.user-avatar .avatar-container .user-status-banner.MNGR { +.user-avatar .avatar-container .user-banner.MNGR { color: var(--user-manager); } -.user-avatar .avatar-container .user-status-banner.TRNSL { +.user-avatar .avatar-container .user-banner.TRNSL { color: var(--user-translator); } -.user-avatar .avatar-container .user-status-banner.NEW { +.user-avatar .avatar-container .user-banner.NEW { color: var(--user-new); } diff --git a/translate/src/modules/user/components/UserAvatar.tsx b/translate/src/modules/user/components/UserAvatar.tsx index 71afb50d2..6d0fac673 100644 --- a/translate/src/modules/user/components/UserAvatar.tsx +++ b/translate/src/modules/user/components/UserAvatar.tsx @@ -28,7 +28,7 @@ export function UserAvatar(props: Props): React.ReactElement<'div'> { User Profile {status && ( - + {status} )} From cfc381a18876b547d7d53865d0179614960f85e0 Mon Sep 17 00:00:00 2001 From: Harmit Goswami Date: Thu, 23 Jan 2025 10:08:57 -0500 Subject: [PATCH 2/3] Renamed all instances of userStatus to userBanner --- pontoon/base/models/comment.py | 2 +- pontoon/base/models/user.py | 4 ++-- pontoon/base/tests/models/test_comment.py | 4 ++-- pontoon/base/tests/models/test_user.py | 16 ++++++------- pontoon/base/views.py | 2 +- translate/src/api/comment.ts | 2 +- translate/src/api/translation.ts | 2 +- .../{useUserStatus.ts => useUserBanner.ts} | 4 ++-- translate/src/hooks/useUserStatus.test.js | 24 +++++++++---------- .../comments/components/AddComment.tsx | 6 ++--- .../modules/comments/components/Comment.tsx | 2 +- .../comments/components/CommentsList.test.js | 6 ++--- .../history/components/History.test.js | 6 ++--- .../history/components/HistoryTranslation.tsx | 2 +- .../components/TeamComments.test.js | 6 ++--- .../modules/user/components/UserAvatar.tsx | 6 ++--- 16 files changed, 47 insertions(+), 47 deletions(-) rename translate/src/hooks/{useUserStatus.ts => useUserBanner.ts} (89%) diff --git a/pontoon/base/models/comment.py b/pontoon/base/models/comment.py index 5bcbd3dcc..30aba4411 100644 --- a/pontoon/base/models/comment.py +++ b/pontoon/base/models/comment.py @@ -31,7 +31,7 @@ def serialize(self, project_contact): return { "author": self.author.name_or_email, "username": self.author.username, - "user_status": self.author.status(locale, project_contact), + "user_banner": self.author.banner(locale, project_contact), "user_gravatar_url_small": self.author.gravatar_url(88), "created_at": self.timestamp.strftime("%b %d, %Y %H:%M"), "date_iso": self.timestamp.isoformat(), diff --git a/pontoon/base/models/user.py b/pontoon/base/models/user.py index 43053aec9..6194fe034 100644 --- a/pontoon/base/models/user.py +++ b/pontoon/base/models/user.py @@ -195,7 +195,7 @@ def user_locale_role(self, locale): return "Contributor" -def user_status(self, locale, project_contact): +def user_banner(self, locale, project_contact): if self.pk is None or self.profile.system_user: return ("", "") if self in locale.managers_group.user_set.all(): @@ -536,7 +536,7 @@ def latest_action(self): User.add_to_class("translated_projects", user_translated_projects) User.add_to_class("role", user_role) User.add_to_class("locale_role", user_locale_role) -User.add_to_class("status", user_status) +User.add_to_class("banner", user_banner) User.add_to_class("contributed_translations", contributed_translations) User.add_to_class("badges_translation_count", badges_translation_count) User.add_to_class("badges_review_count", badges_review_count) diff --git a/pontoon/base/tests/models/test_comment.py b/pontoon/base/tests/models/test_comment.py index 06090d902..091cefe72 100644 --- a/pontoon/base/tests/models/test_comment.py +++ b/pontoon/base/tests/models/test_comment.py @@ -16,7 +16,7 @@ def test_serialize_comments(): assert tr.serialize(project.contact) == { "author": tr.author.name_or_email, "username": tr.author.username, - "user_status": tr.author.status(tr.translation.locale, project.contact), + "user_banner": tr.author.banner(tr.translation.locale, project.contact), "user_gravatar_url_small": tr.author.gravatar_url(88), "created_at": tr.timestamp.strftime("%b %d, %Y %H:%M"), "date_iso": tr.timestamp.isoformat(), @@ -28,7 +28,7 @@ def test_serialize_comments(): assert team.serialize(project.contact) == { "author": team.author.name_or_email, "username": team.author.username, - "user_status": team.author.status(team.locale, project.contact), + "user_banner": team.author.banner(team.locale, project.contact), "user_gravatar_url_small": team.author.gravatar_url(88), "created_at": team.timestamp.strftime("%b %d, %Y %H:%M"), "date_iso": team.timestamp.isoformat(), diff --git a/pontoon/base/tests/models/test_user.py b/pontoon/base/tests/models/test_user.py index 286867be0..34336df94 100644 --- a/pontoon/base/tests/models/test_user.py +++ b/pontoon/base/tests/models/test_user.py @@ -66,34 +66,34 @@ def test_user_locale_role(user_a, user_b, user_c, locale_a): @pytest.mark.django_db -def test_user_status(user_a, user_b, user_c, user_d, gt_user, locale_a, project_a): +def test_user_banner(user_a, user_b, user_c, user_d, gt_user, locale_a, project_a): project_contact = user_d # New User - assert user_a.status(locale_a, project_contact)[1] == "New User" + assert user_a.banner(locale_a, project_contact)[1] == "New User" # Fake user object imported = User(username="Imported") - assert imported.status(locale_a, project_contact)[1] == "" + assert imported.banner(locale_a, project_contact)[1] == "" # Admin user_a.is_superuser = True - assert user_a.status(locale_a, project_contact)[1] == "Admin" + assert user_a.banner(locale_a, project_contact)[1] == "Admin" # Manager locale_a.managers_group.user_set.add(user_b) - assert user_b.status(locale_a, project_contact)[1] == "Team Manager" + assert user_b.banner(locale_a, project_contact)[1] == "Team Manager" # Translator locale_a.translators_group.user_set.add(user_c) - assert user_c.status(locale_a, project_contact)[1] == "Translator" + assert user_c.banner(locale_a, project_contact)[1] == "Translator" # PM - assert user_d.status(locale_a, project_contact)[1] == "Project Manager" + assert user_d.banner(locale_a, project_contact)[1] == "Project Manager" # System user (Google Translate) project_contact = gt_user - assert gt_user.status(locale_a, project_contact)[1] == "" + assert gt_user.banner(locale_a, project_contact)[1] == "" @pytest.fixture diff --git a/pontoon/base/views.py b/pontoon/base/views.py index 6ee819b38..e79836c20 100755 --- a/pontoon/base/views.py +++ b/pontoon/base/views.py @@ -434,7 +434,7 @@ def get_translation_history(request): "uid": u.id, "username": u.username, "user_gravatar_url_small": u.gravatar_url(88), - "user_status": u.status(locale, project_contact), + "user_banner": u.banner(locale, project_contact), "date": t.date, "approved_user": User.display_name_or_blank(t.approved_user), "approved_date": t.approved_date, diff --git a/translate/src/api/comment.ts b/translate/src/api/comment.ts index 8d6f8c006..3472b4c69 100644 --- a/translate/src/api/comment.ts +++ b/translate/src/api/comment.ts @@ -9,7 +9,7 @@ import { keysToCamelCase } from './utils/keysToCamelCase'; export type TranslationComment = { readonly author: string; readonly username: string; - readonly userStatus: string[]; + readonly userBanner: string[]; readonly userGravatarUrlSmall: string; readonly createdAt: string; readonly dateIso: string; diff --git a/translate/src/api/translation.ts b/translate/src/api/translation.ts index 39d798040..b76d81e33 100644 --- a/translate/src/api/translation.ts +++ b/translate/src/api/translation.ts @@ -44,7 +44,7 @@ export type HistoryTranslation = { readonly user: string; readonly username: string; readonly userGravatarUrlSmall: string; - readonly userStatus: string[]; + readonly userBanner: string[]; readonly comments: Array; }; diff --git a/translate/src/hooks/useUserStatus.ts b/translate/src/hooks/useUserBanner.ts similarity index 89% rename from translate/src/hooks/useUserStatus.ts rename to translate/src/hooks/useUserBanner.ts index 2b1cfc57a..c8365b998 100644 --- a/translate/src/hooks/useUserStatus.ts +++ b/translate/src/hooks/useUserBanner.ts @@ -6,9 +6,9 @@ import { USER } from '~/modules/user'; import { useAppSelector } from '~/hooks'; /** - * Return the user's status within the given locale, to display on the user banner + * Return the user's status banner within the given locale, to display on the user banner */ -export function useUserStatus(): Array { +export function useUserBanner(): Array { const { code } = useContext(Locale); const { project } = useContext(Location); const { diff --git a/translate/src/hooks/useUserStatus.test.js b/translate/src/hooks/useUserStatus.test.js index 4a0127462..2c0b87104 100644 --- a/translate/src/hooks/useUserStatus.test.js +++ b/translate/src/hooks/useUserStatus.test.js @@ -4,7 +4,7 @@ import sinon from 'sinon'; import { USER } from '~/modules/user'; import * as Hooks from '~/hooks'; -import { useUserStatus } from './useUserStatus'; +import { useUserBanner } from './useUserBanner'; beforeAll(() => { sinon.stub(Hooks, 'useAppSelector'); @@ -22,10 +22,10 @@ const fakeSelector = (user) => (sel) => [USER]: user, }); -describe('useUserStatus', () => { +describe('useUserBanner', () => { it('returns empty parameters for non-authenticated users', () => { Hooks.useAppSelector.callsFake(fakeSelector({ isAuthenticated: false })), - expect(useUserStatus()).toStrictEqual(['', '']); + expect(useUserBanner()).toStrictEqual(['', '']); }); it('returns [ADMIN, Admin] if user has admin permissions', () => { @@ -38,7 +38,7 @@ describe('useUserStatus', () => { translatorForLocales: [], }), ); - expect(useUserStatus()).toStrictEqual(['ADMIN', 'Admin']); + expect(useUserBanner()).toStrictEqual(['ADMIN', 'Admin']); }); it('returns [PM, Project Manager] if user is a project manager for the project', () => { @@ -50,7 +50,7 @@ describe('useUserStatus', () => { translatorForLocales: [], }), ); - expect(useUserStatus()).toStrictEqual(['PM', 'Project Manager']); + expect(useUserBanner()).toStrictEqual(['PM', 'Project Manager']); }); it('returns [PM, Project Manager] if user is a project manager for the project, even if user is an Admin', () => { @@ -63,7 +63,7 @@ describe('useUserStatus', () => { translatorForLocales: [], }), ); - expect(useUserStatus()).toStrictEqual(['PM', 'Project Manager']); + expect(useUserBanner()).toStrictEqual(['PM', 'Project Manager']); }); it('returns [MNGR, Manager] if user is a manager of the locale', () => { @@ -75,7 +75,7 @@ describe('useUserStatus', () => { translatorForLocales: [], }), ); - expect(useUserStatus()).toStrictEqual(['MNGR', 'Team Manager']); + expect(useUserBanner()).toStrictEqual(['MNGR', 'Team Manager']); }); it('returns [MNGR, Manager] if user is a manager of the locale, even if user is an Admin', () => { @@ -88,7 +88,7 @@ describe('useUserStatus', () => { translatorForLocales: [], }), ); - expect(useUserStatus()).toStrictEqual(['MNGR', 'Team Manager']); + expect(useUserBanner()).toStrictEqual(['MNGR', 'Team Manager']); }); it('returns [MNGR, Manager] if user is a manager of the locale, even if user is a Project Manager', () => { @@ -100,7 +100,7 @@ describe('useUserStatus', () => { translatorForLocales: [], }), ); - expect(useUserStatus()).toStrictEqual(['MNGR', 'Team Manager']); + expect(useUserBanner()).toStrictEqual(['MNGR', 'Team Manager']); }); it('returns [TRNSL, Translator] if user is a translator for the locale', () => { @@ -112,7 +112,7 @@ describe('useUserStatus', () => { translatorForLocales: ['mylocale'], }), ); - expect(useUserStatus()).toStrictEqual(['TRNSL', 'Translator']); + expect(useUserBanner()).toStrictEqual(['TRNSL', 'Translator']); }); it('returns [NEW, New User] if user created their account within the last 3 months', () => { @@ -127,7 +127,7 @@ describe('useUserStatus', () => { dateJoined: dateJoined, }), ); - expect(useUserStatus()).toStrictEqual(['NEW', 'New User']); + expect(useUserBanner()).toStrictEqual(['NEW', 'New User']); // Set join date to be 6 months ago (no longer a new user) dateJoined.setMonth(dateJoined.getMonth() - 6); @@ -140,6 +140,6 @@ describe('useUserStatus', () => { dateJoined: dateJoined, }), ); - expect(useUserStatus()).toStrictEqual(['', '']); + expect(useUserBanner()).toStrictEqual(['', '']); }); }); diff --git a/translate/src/modules/comments/components/AddComment.tsx b/translate/src/modules/comments/components/AddComment.tsx index b40b34bfa..d7a1a7fbb 100644 --- a/translate/src/modules/comments/components/AddComment.tsx +++ b/translate/src/modules/comments/components/AddComment.tsx @@ -30,7 +30,7 @@ import type { MentionUser } from '~/api/user'; import { MentionUsers } from '~/context/MentionUsers'; import type { UserState } from '~/modules/user'; import { UserAvatar } from '~/modules/user'; -import { useUserStatus } from '~/hooks/useUserStatus'; +import { useUserBanner } from '~/hooks/useUserBanner'; import './AddComment.css'; import { MentionList } from './MentionList'; @@ -87,7 +87,7 @@ export function AddComment({ const [mentionIndex, setMentionIndex] = useState(0); const [mentionSearch, setMentionSearch] = useState(''); const [requireUsers, setRequireUsers] = useState(false); - const status = useUserStatus(); + const status = useUserBanner(); const { initMentions, mentionUsers } = useContext(MentionUsers); const [slateKey, resetValue] = useReducer((key) => key + 1, 0); @@ -249,7 +249,7 @@ export function AddComment({
{
diff --git a/translate/src/modules/comments/components/CommentsList.test.js b/translate/src/modules/comments/components/CommentsList.test.js index 248bbbc1d..7edc49cc6 100644 --- a/translate/src/modules/comments/components/CommentsList.test.js +++ b/translate/src/modules/comments/components/CommentsList.test.js @@ -19,9 +19,9 @@ describe('', () => { translation: { ...DEFAULT_TRANSLATION, comments: [ - { id: 1, content: '11', userStatus: '' }, - { id: 2, content: '22', userStatus: '' }, - { id: 3, content: '33', userStatus: '' }, + { id: 1, content: '11', userBanner: '' }, + { id: 2, content: '22', userBanner: '' }, + { id: 3, content: '33', userBanner: '' }, ], }, user: DEFAULT_USER, diff --git a/translate/src/modules/history/components/History.test.js b/translate/src/modules/history/components/History.test.js index 8796905b0..f9a27deb9 100644 --- a/translate/src/modules/history/components/History.test.js +++ b/translate/src/modules/history/components/History.test.js @@ -25,9 +25,9 @@ function mountHistory(fetching, translations) { describe('', () => { it('shows the correct number of translations', () => { const wrapper = mountHistory(false, [ - { pk: 1, userStatus: '' }, - { pk: 2, userStatus: '' }, - { pk: 3, userStatus: '' }, + { pk: 1, userBanner: '' }, + { pk: 2, userBanner: '' }, + { pk: 3, userBanner: '' }, ]); expect(wrapper.find('ul > *')).toHaveLength(3); diff --git a/translate/src/modules/history/components/HistoryTranslation.tsx b/translate/src/modules/history/components/HistoryTranslation.tsx index ecf3661a5..326b81576 100644 --- a/translate/src/modules/history/components/HistoryTranslation.tsx +++ b/translate/src/modules/history/components/HistoryTranslation.tsx @@ -270,7 +270,7 @@ export function HistoryTranslationBase({ username={translation.username} title='' imageUrl={translation.userGravatarUrlSmall} - userStatus={translation.userStatus} + userBanner={translation.userBanner} /> {translation.machinerySources ? ( diff --git a/translate/src/modules/teamcomments/components/TeamComments.test.js b/translate/src/modules/teamcomments/components/TeamComments.test.js index 0c006187a..7120c21d7 100644 --- a/translate/src/modules/teamcomments/components/TeamComments.test.js +++ b/translate/src/modules/teamcomments/components/TeamComments.test.js @@ -23,9 +23,9 @@ describe('', () => { teamComments: { entity: 267, comments: [ - { id: 1, content: '11', userStatus: '' }, - { id: 2, content: '22', userStatus: '' }, - { id: 3, content: '33', userStatus: '' }, + { id: 1, content: '11', userBanner: '' }, + { id: 2, content: '22', userBanner: '' }, + { id: 3, content: '33', userBanner: '' }, ], }, user: DEFAULT_USER, diff --git a/translate/src/modules/user/components/UserAvatar.tsx b/translate/src/modules/user/components/UserAvatar.tsx index 6d0fac673..c6364b1cf 100644 --- a/translate/src/modules/user/components/UserAvatar.tsx +++ b/translate/src/modules/user/components/UserAvatar.tsx @@ -7,12 +7,12 @@ type Props = { username: string; title?: string; imageUrl: string; - userStatus: string[]; + userBanner: string[]; }; export function UserAvatar(props: Props): React.ReactElement<'div'> { - const { username, title, imageUrl, userStatus } = props; - const [status, tooltip] = userStatus; + const { username, title, imageUrl, userBanner } = props; + const [status, tooltip] = userBanner; return (
From f91a923c623e741300ddbe58f2349cf130b35328 Mon Sep 17 00:00:00 2001 From: Harmit Goswami Date: Thu, 23 Jan 2025 11:35:24 -0500 Subject: [PATCH 3/3] Addressed review comments --- .../hooks/{useUserStatus.test.js => useUserBanner.test.js} | 0 translate/src/modules/comments/components/AddComment.tsx | 4 ++-- 2 files changed, 2 insertions(+), 2 deletions(-) rename translate/src/hooks/{useUserStatus.test.js => useUserBanner.test.js} (100%) diff --git a/translate/src/hooks/useUserStatus.test.js b/translate/src/hooks/useUserBanner.test.js similarity index 100% rename from translate/src/hooks/useUserStatus.test.js rename to translate/src/hooks/useUserBanner.test.js diff --git a/translate/src/modules/comments/components/AddComment.tsx b/translate/src/modules/comments/components/AddComment.tsx index d7a1a7fbb..c550ee39e 100644 --- a/translate/src/modules/comments/components/AddComment.tsx +++ b/translate/src/modules/comments/components/AddComment.tsx @@ -87,7 +87,7 @@ export function AddComment({ const [mentionIndex, setMentionIndex] = useState(0); const [mentionSearch, setMentionSearch] = useState(''); const [requireUsers, setRequireUsers] = useState(false); - const status = useUserBanner(); + const banner = useUserBanner(); const { initMentions, mentionUsers } = useContext(MentionUsers); const [slateKey, resetValue] = useReducer((key) => key + 1, 0); @@ -249,7 +249,7 @@ export function AddComment({