From 14186baadb890df7d7ebe74d5127691809d437a7 Mon Sep 17 00:00:00 2001
From: "dmitrii.pichenikin" <dmitrii.pichenikin@wilix.team>
Date: Tue, 10 Mar 2026 10:40:30 +0300
Subject: [PATCH] added my achievements tab

---
 webapp/src/components/rhs/all_badges.scss | 25 +++++++++++++++++++++--
 webapp/src/components/rhs/index.tsx       | 11 +++++++++-
 2 files changed, 33 insertions(+), 3 deletions(-)

diff --git a/webapp/src/components/rhs/all_badges.scss b/webapp/src/components/rhs/all_badges.scss
index 014be3c..e823688 100644
--- a/webapp/src/components/rhs/all_badges.scss
+++ b/webapp/src/components/rhs/all_badges.scss
@@ -60,16 +60,35 @@
     &__tabs {
         display: flex;
         gap: 0;
+        flex-shrink: 1;
+        min-width: 0;
+        overflow-x: auto;
+        -webkit-overflow-scrolling: touch;
+        padding-bottom: 2px;
+
+        &::-webkit-scrollbar {
+            height: 3px;
+        }
+
+        &::-webkit-scrollbar-track {
+            background: transparent;
+        }
+
+        &::-webkit-scrollbar-thumb {
+            background: rgba(var(--center-channel-color-rgb, 61, 60, 64), 0.2);
+            border-radius: 3px;
+        }
     }
 
     &__tab {
         background: none;
         border: none;
         border-bottom: 2px solid transparent;
-        padding: 4px 12px;
+        padding: 4px 8px;
         font-size: 13px;
         font-weight: 600;
         cursor: pointer;
+        white-space: nowrap;
         color: rgba(var(--center-channel-color-rgb, 61, 60, 64), 0.64);
 
         &:hover {
@@ -122,10 +141,12 @@
         color: var(--button-color, #fff);
         border: none;
         border-radius: 4px;
-        padding: 4px 12px;
+        padding: 4px 10px;
         font-size: 12px;
         font-weight: 600;
         cursor: pointer;
+        white-space: nowrap;
+        flex-shrink: 0;
 
         &:hover {
             opacity: 0.88;
diff --git a/webapp/src/components/rhs/index.tsx b/webapp/src/components/rhs/index.tsx
index 6e6c1b2..a1c14c3 100644
--- a/webapp/src/components/rhs/index.tsx
+++ b/webapp/src/components/rhs/index.tsx
@@ -52,7 +52,7 @@ const RHS: React.FC = () => {
         });
     }, []);
 
-    const showTabs = currentView === RHS_STATE_ALL || currentView === RHS_STATE_TYPES;
+    const showTabs = currentView === RHS_STATE_MY || currentView === RHS_STATE_ALL || currentView === RHS_STATE_TYPES;
 
     const handleCreateBadge = useCallback(() => {
         dispatch(openCreateBadgeModal());
@@ -70,6 +70,15 @@ const RHS: React.FC = () => {
         return (
             <div className='AllBadges__header'>
                 <div className='AllBadges__tabs'>
+                    <button
+                        className={'AllBadges__tab' + (currentView === RHS_STATE_MY ? ' AllBadges__tab--active' : '')}
+                        onClick={() => dispatch(setRHSView(RHS_STATE_MY))}
+                    >
+                        <FormattedMessage
+                            id='badges.rhs.my_badges'
+                            defaultMessage='Мои'
+                        />
+                    </button>
                     <button
                         className={'AllBadges__tab' + (currentView === RHS_STATE_ALL ? ' AllBadges__tab--active' : '')}
                         onClick={() => dispatch(setRHSView(RHS_STATE_ALL))}