Merge branch 'main' into og-urls

graphql-hive · Feb 12, 2025 · 79e2393 · 79e2393
2 parents e916779 + 73abccf
commit 79e2393
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 2 deletions.
diff --git a/packages/web/docs/src/app/gateway/gateway-feature-tabs.tsx b/packages/web/docs/src/app/gateway/gateway-feature-tabs.tsx
@@ -61,6 +61,14 @@ export function GatewayFeatureTabs(props: { className?: string }) {
         'border-blue-200 [--tab-bg-dark:theme(colors.blue.300)] [--tab-bg:theme(colors.blue.200)]',
         props.className,
       )}
+      tabTexts={{
+        'Observability & Performance Monitoring': (
+          <span>
+            Observability & Performance{' '}
+            <span className="[@media(width<420px)]:hidden">Monitoring</span>
+          </span>
+        ),
+      }}
     >
       <FeatureTab
         title="Observability & Performance Monitoring"

diff --git a/packages/web/docs/src/components/feature-tabs.tsx b/packages/web/docs/src/components/feature-tabs.tsx
@@ -1,6 +1,6 @@
 'use client';
 
-import { createContext, useContext, useState } from 'react';
+import { createContext, ReactNode, useContext, useState } from 'react';
 import Image, { StaticImageData } from 'next/image';
 import NextLink from 'next/link';
 import { ChevronDownIcon } from '@radix-ui/react-icons';
@@ -20,13 +20,18 @@ export interface FeatureTabsProps<T extends string> {
   highlights: Record<T, Highlight[]>;
   icons: React.ReactNode[];
   children: React.ReactNode;
+  /**
+   * On very narrow screens, we shorten the tab names.
+   */
+  tabTexts?: Partial<Record<T, ReactNode>>;
 }
 
 export function FeatureTabs<T extends string>({
   className,
   highlights,
   icons,
   children,
+  tabTexts = {},
 }: FeatureTabsProps<T>) {
   const tabs = Object.keys(highlights) as T[];
   const [currentTab, setCurrentTab] = useState<T>(tabs[0]);
@@ -64,7 +69,7 @@ export function FeatureTabs<T extends string>({
                   className='hive-focus rdx-state-active:text-green-1000 rdx-state-active:border-[--tab-bg-dark] rdx-state-active:bg-white max-sm:rdx-state-inactive:hidden group-focus-within:rdx-state-inactive:flex max-sm:rdx-state-inactive:rounded-none max-sm:group-focus-within:rdx-state-inactive:border-y-[--tab-bg] max-sm:group-focus-within:[&:nth-child(2)]:rdx-state-active:rounded-none max-sm:group-focus-within:[&:nth-child(2)]:rdx-state-active:border-y-[--tab-bg] max-sm:group-focus-within:first:rdx-state-active:border-b-[--tab-bg] max-sm:group-focus-within:first:rdx-state-active:rounded-b-none max-sm:rdx-state-inactive:pointer-events-none max-sm:rdx-state-inactive:group-focus-within:pointer-events-auto z-10 flex flex-1 items-center justify-center gap-2.5 rounded-lg border-transparent p-4 text-base font-medium leading-6 text-green-800 max-sm:border max-sm:border-[--tab-bg-dark] max-sm:bg-[--tab-bg] max-sm:group-focus-within:aria-selected:z-20 max-sm:group-focus-within:aria-selected:ring-4 sm:rounded-[15px] sm:border sm:text-xs sm:max-lg:p-3 sm:max-[721px]:p-2 md:text-sm lg:text-base max-sm:group-focus-within:[&:last-child]:border-t-[--tab-bg] max-sm:group-focus-within:[&:nth-child(3)]:rounded-t-none [&>svg]:shrink-0 max-sm:group-focus-within:[&[data-state="inactive"]:first-child]:rounded-t-lg max-sm:group-focus-within:[&[data-state="inactive"]:first-child]:border-t-[--tab-bg-dark] [&[data-state="inactive"]>:last-child]:invisible max-sm:group-focus-within:[[data-state="active"]+&:last-child]:rounded-b-lg max-sm:group-focus-within:[[data-state="active"]+&:last-child]:border-b-[--tab-bg-dark] max-sm:group-focus-within:[[data-state="inactive"]+&:last-child[data-state="inactive"]]:rounded-b-lg max-sm:group-focus-within:[[data-state="inactive"]+&:last-child[data-state="inactive"]]:border-b-[--tab-bg-dark]'
                 >
                   {icons[i]}
-                  {tab}
+                  {tabTexts[tab] || tab}
                   <ChevronDownIcon className="ml-auto size-6 text-green-800 transition group-focus-within:rotate-90 sm:hidden" />
                 </Tabs.Trigger>
               );

diff --git a/packages/web/docs/src/content/gateway/other-features/performance/index.mdx b/packages/web/docs/src/content/gateway/other-features/performance/index.mdx
@@ -80,6 +80,30 @@ export const gatewayConfig = defineConfig({
 })
 ```
 
+#### Redis Sentinel
+
+If you are using
+[Redis Sentinel](https://redis.io/docs/latest/operate/oss_and_stack/management/sentinel/), You can
+use the `sentinels` option to connect to the Redis Sentinel.
+
+```ts filename="gateway.config.ts"
+import { defineConfig } from '@graphql-hive/gateway'
+
+export const gatewayConfig = defineConfig({
+  cache: {
+    type: 'redis',
+    sentinels: [
+      { host: 'localhost', port: 26379 },
+      { host: 'localhost', port: 26380 },
+      { host: 'localhost', port: 26381 }
+    ]
+  },
+  responseCaching: {
+    session: () => null
+  }
+})
+```
+
 ### Cloudflare Workers KV
 
 Cloudflare Workers KV is a distributed, eventually consistent key-value store available in the