commit 5973297f716bd322e1e2adbe4351248f976a7194 · notnite.com/moonlight

+13

packages/core-extensions/src/moonbase/style.css

···

       16
       16
        
         resize: vertical;

     

       17
       17
        
       }

     

       18
       18
        
       

     

       19
       19
       +
       .moonbase-speen {

     

       20
       20
       +
         animation: moonbase-speen-animation 0.25s linear infinite;

     

       21
       21
       +
       }

     

       22
       22
       +
       

     

       23
       23
       +
       @keyframes moonbase-speen-animation {

     

       24
       24
       +
         from {

     

       25
       25
       +
           transform: rotate(0deg);

     

       26
       26
       +
         }

     

       27
       27
       +
         to {

     

       28
       28
       +
           transform: rotate(360deg);

     

       29
       29
       +
         }

     

       30
       30
       +
       }

     

       31
       31
       +
       

     

       19
       32
        
       /* Update notice at the top of the client */

     

       20
       33
        
       .moonbase-updates-notice {

     

       21
       34
        
         background-color: var(--moonbase-bg);

+17 -2

packages/core-extensions/src/moonbase/webpackModules/ui/extensions/filterBar.tsx

···

       199
       199
        
         const tagsContainer = React.useRef<HTMLDivElement>(null);

     

       200
       200
        
         const tagListInner = React.useRef<HTMLDivElement>(null);

     

       201
       201
        
         const [tagsButtonOffset, setTagsButtonOffset] = React.useState(0);

     

       202
       202
       +
         const [checkingUpdates, setCheckingUpdates] = React.useState(false);

     

       203
       203
       +
       

     

       202
       204
        
         React.useLayoutEffect(() => {

     

       203
       205
        
           if (tagsContainer.current === null || tagListInner.current === null) return;

     

       204
       206
        
           const { left: containerX, top: containerY } = tagsContainer.current.getBoundingClientRect();

     
···

       228
       230
        
                   {...props}

     

       229
       231
        
                   size={Button.Sizes.MIN}

     

       230
       232
        
                   color={Button.Colors.CUSTOM}

     

       231
       231
       -
                   className={`${FilterBarClasses.sortDropdown} moonbase-retry-button`}

     

       233
       233
       +
                   className={`${FilterBarClasses.sortDropdown} moonbase-retry-button ${

     

       234
       234
       +
                     checkingUpdates ? "moonbase-speen" : ""

     

       235
       235
       +
                   }`}

     

       232
       236
        
                   innerClassName={FilterBarClasses.sortDropdownInner}

     

       233
       233
       -
                   onClick={() => MoonbaseSettingsStore.checkUpdates()}

     

       237
       237
       +
                   onClick={() => {

     

       238
       238
       +
                     (async () => {

     

       239
       239
       +
                       try {

     

       240
       240
       +
                         setCheckingUpdates(true);

     

       241
       241
       +
                         await MoonbaseSettingsStore.checkUpdates();

     

       242
       242
       +
                       } finally {

     

       243
       243
       +
                         // artificial delay because the spin is fun

     

       244
       244
       +
                         await new Promise((r) => setTimeout(r, 500));

     

       245
       245
       +
                         setCheckingUpdates(false);

     

       246
       246
       +
                       }

     

       247
       247
       +
                     })();

     

       248
       248
       +
                   }}

     

       234
       249
        
                 >

     

       235
       250
        
                   <RetryIcon size={"custom"} width={16} />

     

       236
       251
        
                 </Button>