diff --git a/.github/workflows/release.yaml b/.github/workflows/release.yaml index eb15a6f..2949484 100644 --- a/.github/workflows/release.yaml +++ b/.github/workflows/release.yaml @@ -64,15 +64,9 @@ jobs: uses: docker/metadata-action@v5 with: images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }} - tags: | - type=raw,value=latest,enable={{is_default_branch}} - type=schedule - type=ref,event=branch - type=ref,event=pr - type=semver,pattern={{version}} - type=semver,pattern={{major}}.{{minor}} - type=semver,pattern={{major}} - type=sha + tags: + - ${{ needs.release-please.outputs.release_tag_name }} + - latest - name: Set up QEMU uses: docker/setup-qemu-action@v3 diff --git a/flags.json b/flags.json index 31def5d..4036689 100644 --- a/flags.json +++ b/flags.json @@ -17,7 +17,7 @@ }, "defaultVariant": "on", "targeting": { - "if": [{ "==": [{ "var": "size" }, "sm"]}, "on", "off" ] + "if": [{ "==": [{ "var": "size" }, "sm"]}, "on", null ] } }, "use-distributed-db": { diff --git a/kubernetes/toggle-shop.yaml b/kubernetes/toggle-shop.yaml index 9c1b7dd..e8e2a86 100644 --- a/kubernetes/toggle-shop.yaml +++ b/kubernetes/toggle-shop.yaml @@ -26,7 +26,7 @@ spec: # - var: size # - sm # - 'on' - # - 'off' + # - --- # Flags for our backend application apiVersion: core.openfeature.dev/v1beta1 diff --git a/src/app/checkout/page.tsx b/src/app/checkout/page.tsx index d981bad..a88f31a 100644 --- a/src/app/checkout/page.tsx +++ b/src/app/checkout/page.tsx @@ -1,15 +1,16 @@ "use client"; -import { useMemo, useReducer } from "react"; -import { useRouter } from "next/navigation"; -import Link from "next/link"; -import Image from "next/image"; -import { ArrowLeft, ArrowRight, Minus, Plus, X } from "lucide-react"; -import { useCart } from "@/hooks/use-cart"; import Header from "@/components/Header"; -import { useMutation, useQueryClient } from "@tanstack/react-query"; -import { tanstackMetaToHeader } from "@/libs/open-feature/evaluation-context"; +import { useCart } from "@/hooks/use-cart"; +import { setTargetingKeyHeader } from "@/libs/open-feature/evaluation-context"; +import { TARGETING_KEY } from "@/libs/targeting-key"; import { useFlag, useTrack } from "@openfeature/react-sdk"; +import { useMutation } from "@tanstack/react-query"; +import { ArrowLeft, ArrowRight, Minus, Plus, X } from "lucide-react"; +import Image from "next/image"; +import Link from "next/link"; +import { useRouter } from "next/navigation"; +import { useMemo, useReducer } from "react"; export default function Checkout() { const { cartItems, removeFromCart, updateQuantity } = useCart(); @@ -169,16 +170,13 @@ function CheckoutForm() { const router = useRouter(); const { cartItems, clearCart } = useCart(); - const queryClient = useQueryClient(); const mutation = useMutation({ mutationFn: () => { return fetch("/api/orders", { method: "POST", headers: { "Content-Type": "application/json", - ...tanstackMetaToHeader( - queryClient.getDefaultOptions().mutations?.meta - ), + ...setTargetingKeyHeader(TARGETING_KEY), }, body: JSON.stringify({ items: cartItems, diff --git a/src/app/layout.tsx b/src/app/layout.tsx index a9edd61..5d4b52d 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -3,7 +3,7 @@ import { Inter } from "next/font/google"; import { CartProvider } from "@/providers/cart"; import { ReactQueryProvider } from "@/providers/react-query"; import { OpenFeatureProvider } from "@/providers/open-feature"; -import { v4 } from "uuid"; +import { TARGETING_KEY } from "@/libs/targeting-key"; const inter = Inter({ subsets: ["latin"] }); @@ -12,8 +12,6 @@ export const metadata = { description: "If it can toggle, you'll find it here!", }; -const targetingKey = v4(); - export default function RootLayout({ children, }: { @@ -22,8 +20,8 @@ export default function RootLayout({ return ( - - + + {children} diff --git a/src/hooks/use-products.tsx b/src/hooks/use-products.tsx index 7a52390..7f16afb 100644 --- a/src/hooks/use-products.tsx +++ b/src/hooks/use-products.tsx @@ -3,7 +3,8 @@ import { useSuspenseQuery } from "@tanstack/react-query"; import type { Product } from "@/types/product"; import { getBaseUrl } from "@/libs/url"; -import { tanstackMetaToHeader } from "@/libs/open-feature/evaluation-context"; +import { setTargetingKeyHeader } from "@/libs/open-feature/evaluation-context"; +import { TARGETING_KEY } from "@/libs/targeting-key"; export function useProducts() { const { data } = useSuspenseQuery({ @@ -12,7 +13,7 @@ export function useProducts() { console.log("fetching products"); const res = await fetch(getBaseUrl() + "/api/products", { cache: "no-store", - headers: tanstackMetaToHeader(meta), + headers: setTargetingKeyHeader(TARGETING_KEY), }); if (!res.ok) { throw new Error("Failed to fetch products"); @@ -30,7 +31,7 @@ export function useProduct(id: string) { console.log(`fetching product ${id}`); const res = await fetch(getBaseUrl() + `/api/products/${id}`, { cache: "no-store", - headers: tanstackMetaToHeader(meta), + headers: setTargetingKeyHeader(TARGETING_KEY), }); if (!res.ok) { throw new Error("Failed to fetch products"); diff --git a/src/libs/open-feature/evaluation-context.ts b/src/libs/open-feature/evaluation-context.ts index b3ee5b1..16e7ba5 100644 --- a/src/libs/open-feature/evaluation-context.ts +++ b/src/libs/open-feature/evaluation-context.ts @@ -2,16 +2,12 @@ import type { EvaluationContext } from "@openfeature/core"; const TARGETING_KEY_HEADER = "x-targeting-key"; -export function tanstackMetaToHeader( - meta?: EvaluationContext +export function setTargetingKeyHeader( + targetingKey: string ): Record { - if (meta && meta.targetingKey) { - return { - [TARGETING_KEY_HEADER]: meta.targetingKey, - }; - } - - return {}; + return { + [TARGETING_KEY_HEADER]: targetingKey, + }; } export function headerToEvaluationContext( diff --git a/src/libs/targeting-key.ts b/src/libs/targeting-key.ts new file mode 100644 index 0000000..148da3d --- /dev/null +++ b/src/libs/targeting-key.ts @@ -0,0 +1,5 @@ +'use client' + +import { v4 } from "uuid"; + +export const TARGETING_KEY = v4(); diff --git a/src/providers/react-query.tsx b/src/providers/react-query.tsx index de85eb6..e02c4ea 100644 --- a/src/providers/react-query.tsx +++ b/src/providers/react-query.tsx @@ -1,33 +1,14 @@ "use client"; import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; -import { useMemo } from "react"; -import type { EvaluationContext } from "@openfeature/react-sdk"; - -declare module "@tanstack/react-query" { - interface Register { - queryMeta: EvaluationContext; - mutationMeta: EvaluationContext; - } -} export function ReactQueryProvider({ - targetingKey, children, }: { - targetingKey: string; children: React.ReactNode; }) { - const queryClient = useMemo(() => { - return new QueryClient({ - defaultOptions: { - queries: { meta: { targetingKey } }, - mutations: { meta: { targetingKey } }, - }, - }); - }, [targetingKey]); return ( - {children} + {children} ); }