N
Novu•5w ago
rajat

Broken tabs in <Inbox>

Hi Support, After adding more tabs the UI seems broken. 
  const tabs = useMemo(() => [
    { label: 'All' },
    { label: 'Command Center', filter: { tags: ['primary-shipment-state', 'document-upload'] } },
    { label: 'Live Risk', filter: { tags: ['live-risk-status', 'live-risk-event'] } },
    { label: 'Temp. Release', filter: { tags: ['temperature-release'] } },
    { label: 'Comments', filter: { tags: ['comments'] } }
  ], []);


  <Inbox
    appearance={appearanceConfig}
    tabs={tabs}
    preferenceGroups={preferenceGroups}
    routerPush={handleRouterPush}
  >
    <InboxContent
      onPrimaryActionClick={(notification) => {
        console.log('onPrimaryActionClick', notification.primaryAction?.redirect?.url || '');
      }}
      onNotificationClick={(notification) => {
        console.log('onNotificationClick', notification.primaryAction?.redirect?.url || '');
      }}
    />
  </Inbox>
  const tabs = useMemo(() => [
    { label: 'All' },
    { label: 'Command Center', filter: { tags: ['primary-shipment-state', 'document-upload'] } },
    { label: 'Live Risk', filter: { tags: ['live-risk-status', 'live-risk-event'] } },
    { label: 'Temp. Release', filter: { tags: ['temperature-release'] } },
    { label: 'Comments', filter: { tags: ['comments'] } }
  ], []);


  <Inbox
    appearance={appearanceConfig}
    tabs={tabs}
    preferenceGroups={preferenceGroups}
    routerPush={handleRouterPush}
  >
    <InboxContent
      onPrimaryActionClick={(notification) => {
        console.log('onPrimaryActionClick', notification.primaryAction?.redirect?.url || '');
      }}
      onNotificationClick={(notification) => {
        console.log('onNotificationClick', notification.primaryAction?.redirect?.url || '');
      }}
    />
  </Inbox>
No description
4 Replies
Novu_Bot
Novu_Bot•5w ago
@rajat, you just advanced to level 1!
Pawan Jain
Pawan Jain•5w ago
Just tried from from my side
Pawan Jain
Pawan Jain•5w ago
It is working as expected Are you customizing inbox popover width? adding custom styles?
rajat
rajatOP•5w ago
Faced this issue while the browser window size was changed. (switching monitor display) Refreshing the page solved it.

Did you find this page helpful?