diff --git a/src/ui/assets/premium.svg b/src/ui/assets/premium.svg new file mode 100644 index 000000000..6349f335a --- /dev/null +++ b/src/ui/assets/premium.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/ui/pages/Overview/ConnectionHeader/ConnectionHeader.tsx b/src/ui/pages/Overview/ConnectionHeader/ConnectionHeader.tsx index eeb9e087f..8ad3c1462 100644 --- a/src/ui/pages/Overview/ConnectionHeader/ConnectionHeader.tsx +++ b/src/ui/pages/Overview/ConnectionHeader/ConnectionHeader.tsx @@ -1,6 +1,6 @@ import React, { useCallback, useEffect, useRef, useState } from 'react'; import { useMutation, useQuery } from '@tanstack/react-query'; -import SettingsIcon from 'jsx:src/ui/assets/filters.svg'; +import GlobeIcon from 'jsx:src/ui/assets/globe.svg'; import { invariant } from 'src/shared/invariant'; import { PauseInjectionControl } from 'src/ui/components/PauseInjection'; import { PausedHeader, usePausedData } from 'src/ui/components/PauseInjection'; @@ -138,7 +138,7 @@ export function ConnectionHeader() { }} disabled={!tabData} > - + + + + Zerion Premium + + + + ), + }, + { + key: 9, + pad: false, + style: { paddingInline: 0 }, + component: ( + + + + + What's New + + + + ), + }, + { + key: 10, + pad: false, + style: { paddingInline: 0 }, + component: ( + + + + + Help & Support + + + + ), + }, + { + key: 11, onClick: async () => { await logout.mutateAsync(); navigate('/login');