New schema for pixels and links.

src/components/hooks/index.ts

@@ -4,7 +4,11 @@ export * from './queries/useEventDataQuery';
 export * from './queries/useEventDataEventsQuery';
 export * from './queries/useEventDataPropertiesQuery';
 export * from './queries/useEventDataValuesQuery';
+export * from './queries/useLinkQuery';
+export * from './queries/useLinksQuery';
 export * from './queries/useLoginQuery';
+export * from './queries/usePixelQuery';
+export * from './queries/usePixelsQuery';
 export * from './queries/useRealtimeQuery';
 export * from './queries/useResultQuery';
 export * from './queries/useReportQuery';
@@ -49,8 +53,10 @@ export * from './useLanguageNames';
 export * from './useLocale';
 export * from './useMessages';
 export * from './useModified';
+export * from './useNavigation';
 export * from './usePagedQuery';
 export * from './useRegionNames';
 export * from './useSticky';
-export * from './useNavigation';
+export * from './useTeam';
 export * from './useTimezone';
+export * from './useWebsite';

src/components/hooks/queries/useLinkQuery.ts

@@ -0,0 +1,15 @@
+import { useApi } from '../useApi';
+import { useModified } from '../useModified';
+
+export function useLinkQuery(linkId: string) {
+  const { get, useQuery } = useApi();
+  const { modified } = useModified(`link:${linkId}`);
+
+  return useQuery({
+    queryKey: ['link', { linkId, modified }],
+    queryFn: () => {
+      return get(`/link/${linkId}`);
+    },
+    enabled: !!linkId,
+  });
+}

src/components/hooks/queries/useLinksQuery.ts

@@ -0,0 +1,15 @@
+import { useApi } from '../useApi';
+import { usePagedQuery } from '../usePagedQuery';
+import { useModified } from '../useModified';
+import { ReactQueryOptions } from '@/lib/types';
+
+export function useLinksQuery({ teamId }: { teamId?: string }, options?: ReactQueryOptions<any>) {
+  const { modified } = useModified('links');
+  const { get } = useApi();
+
+  return usePagedQuery({
+    queryKey: ['links', { teamId, modified }],
+    queryFn: async () => get(teamId ? `/teams/${teamId}/links` : '/links'),
+    ...options,
+  });
+}

src/components/hooks/queries/usePixelQuery.ts

@@ -0,0 +1,15 @@
+import { useApi } from '../useApi';
+import { useModified } from '../useModified';
+
+export function usePixelQuery(pixelId: string) {
+  const { get, useQuery } = useApi();
+  const { modified } = useModified(`pixel:${pixelId}`);
+
+  return useQuery({
+    queryKey: ['pixel', { pixelId, modified }],
+    queryFn: () => {
+      return get(`/pixel/${pixelId}`);
+    },
+    enabled: !!pixelId,
+  });
+}

src/components/hooks/queries/usePixelsQuery.ts

@@ -0,0 +1,19 @@
+import { useApi } from '../useApi';
+import { usePagedQuery } from '../usePagedQuery';
+import { useModified } from '../useModified';
+import { ReactQueryOptions } from '@/lib/types';
+
+export function usePixelsQuery(
+  { websiteId, type }: { websiteId: string; type?: string },
+  options?: ReactQueryOptions<any>,
+) {
+  const { modified } = useModified(`pixels:${type}`);
+  const { get } = useApi();
+
+  return usePagedQuery({
+    queryKey: ['pixels', { websiteId, type, modified }],
+    queryFn: async () => get('/pixels', { websiteId, type }),
+    enabled: !!websiteId && !!type,
+    ...options,
+  });
+}

src/components/hooks/queries/useUpdateQuery.ts

@@ -0,0 +1,11 @@
+import { useApi, useModified } from '@/components/hooks';
+
+export function useUpdateQuery(path: string, params?: Record<string, any>) {
+  const { post, useMutation } = useApi();
+  const { mutate, isPending, error } = useMutation({
+    mutationFn: (data: Record<string, any>) => post(path, { ...data, ...params }),
+  });
+  const { touch } = useModified();
+
+  return { mutate, isPending, error, touch };
+}

src/components/hooks/useTeam.ts

@@ -0,0 +1,6 @@
+import { TeamContext } from '@/app/(main)/settings/teams/[teamId]/TeamProvider';
+import { useContext } from 'react';
+
+export function useTeam() {
+  return useContext(TeamContext);
+}

src/components/input/PanelButton.tsx

@@ -11,7 +11,7 @@ export function PanelButton(props: ButtonProps) {
       {...props}
       style={{ padding: 0 }}
     >
-      <Icon>
+      <Icon strokeColor="muted">
         <PanelLeft />
       </Icon>
     </Button>

src/components/input/TeamsButton.tsx

@@ -15,7 +15,7 @@ import {
   Pressable,
 } from '@umami/react-zen';
 import { useLoginQuery, useMessages, useUserTeamsQuery, useNavigation } from '@/components/hooks';
-import { Chevron, User, Users, LogOut } from '@/components/icons';
+import { Chevron, User, Users } from '@/components/icons';
 
 export function TeamsButton({ showText = true }: { showText?: boolean }) {
   const { user } = useLoginQuery();
@@ -79,17 +79,6 @@ export function TeamsButton({ showText = true }: { showText?: boolean }) {
                 </MenuItem>
               ))}
             </MenuSection>
-            <MenuSeparator />
-            <MenuSection>
-              <MenuItem id="logout">
-                <Row alignItems="center" gap>
-                  <Icon size="sm">
-                    <LogOut />
-                  </Icon>
-                  <Text wrap="nowrap">{formatMessage(labels.logout)}</Text>
-                </Row>
-              </MenuItem>
-            </MenuSection>
           </Menu>
         </Box>
       </Popover>

src/components/messages.ts

@@ -325,9 +325,13 @@ export const labels = defineMessages({
   other: { id: 'label.other', defaultMessage: 'Other' },
   boards: { id: 'label.boards', defaultMessage: 'Boards' },
   apply: { id: 'label.apply', defaultMessage: 'Apply' },
+  link: { id: 'label.link', defaultMessage: 'Link' },
   links: { id: 'label.links', defaultMessage: 'Links' },
+  pixel: { id: 'label.pixel', defaultMessage: 'Pixel' },
   pixels: { id: 'label.pixels', defaultMessage: 'Pixels' },
   addBoard: { id: 'label.add-board', defaultMessage: 'Add board' },
+  addLink: { id: 'label.add-link', defaultMessage: 'Add link' },
+  addPixel: { id: 'label.add-pixel', defaultMessage: 'Add pixel' },
   maximize: { id: 'label.maximize', defaultMessage: 'Maximize' },
   remaining: { id: 'label.remaining', defaultMessage: 'Remaining' },
   conversion: { id: 'label.conversion', defaultMessage: 'Conversion' },
@@ -347,6 +351,7 @@ export const labels = defineMessages({
   saveSegment: { id: 'label.save-segment', defaultMessage: 'Save as segment' },
   saveCohort: { id: 'label.save-cohort', defaultMessage: 'Save as cohort' },
   analysis: { id: 'label.analysis', defaultMessage: 'Analysis' },
+  destinationUrl: { id: 'label.destination-url', defaultMessage: 'Destination URL' },
 });
 
 export const messages = defineMessages({