From 94ccc71357e25878605209ce73b05f76e2a109be Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89mile=20R=C3=A9?= Date: Wed, 29 Apr 2026 15:33:49 +0400 Subject: [PATCH] Switch console cookies page to cookie patterns MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The console now manages CookiePattern entities instead of raw Cookie rows. The frontend queries cookiePatterns on each category and uses createCookiePattern, updateCookiePattern, deleteCookiePattern, and moveCookiePatternToCategory mutations. The entire Cookie GraphQL surface (type, connection, mutations, inputs, payloads, resolvers, Go types) is removed since the backing struct already lost description and cookieCategoryID. Signed-off-by: Émile Ré --- .../_components/CookieDialog.tsx | 161 ----------- .../cookies/_components/CategorySection.tsx | 150 +++++----- .../cookies/_components/EditCookieRow.tsx | 6 +- .../api/console/v1/cookie_banner_resolvers.go | 266 +----------------- .../console/v1/graphql/cookie_banner.graphql | 102 ------- pkg/server/api/console/v1/types/cookie.go | 79 ------ 6 files changed, 80 insertions(+), 684 deletions(-) delete mode 100644 apps/console/src/pages/organizations/cookie-banners/configuration/_components/CookieDialog.tsx delete mode 100644 pkg/server/api/console/v1/types/cookie.go diff --git a/apps/console/src/pages/organizations/cookie-banners/configuration/_components/CookieDialog.tsx b/apps/console/src/pages/organizations/cookie-banners/configuration/_components/CookieDialog.tsx deleted file mode 100644 index b4f425ad7..000000000 --- a/apps/console/src/pages/organizations/cookie-banners/configuration/_components/CookieDialog.tsx +++ /dev/null @@ -1,161 +0,0 @@ -// Copyright (c) 2026 Probo Inc . -// -// Permission to use, copy, modify, and/or distribute this software for any -// purpose with or without fee is hereby granted, provided that the above -// copyright notice and this permission notice appear in all copies. -// -// THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH -// REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY -// AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, -// INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM -// LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR -// OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR -// PERFORMANCE OF THIS SOFTWARE. - -import { formatError, type GraphQLError } from "@probo/helpers"; -import { useTranslate } from "@probo/i18n"; -import { - Button, - Dialog, - DialogContent, - DialogFooter, - Field, - Input, - Label, - Option, - Select, - useDialogRef, - useToast, -} from "@probo/ui"; -import { useState } from "react"; -import { useMutation } from "react-relay"; -import { graphql } from "relay-runtime"; - -import type { CookieDialogCreateMutation } from "#/__generated__/core/CookieDialogCreateMutation.graphql"; - -const createCookieMutation = graphql` - mutation CookieDialogCreateMutation($input: CreateCookieInput!) { - createCookie(input: $input) { - cookieEdge { - node { - id - name - duration - description - } - } - cookieBanner { - id - latestVersion { - id - version - state - } - } - } - } -`; - -interface Category { - id: string; - name: string; -} - -interface CookieDialogProps { - categories: ReadonlyArray; - onOpenChange: (open: boolean) => void; -} - -export function CookieDialog({ categories, onOpenChange }: CookieDialogProps) { - const { __ } = useTranslate(); - const { toast } = useToast(); - const dialogRef = useDialogRef(); - - const [createCookie, isCreating] = useMutation(createCookieMutation); - - const [categoryId, setCategoryId] = useState(categories[0]?.id ?? ""); - const [name, setName] = useState(""); - const [duration, setDuration] = useState(""); - const [description, setDescription] = useState(""); - - const handleSubmit = (e: React.FormEvent) => { - e.preventDefault(); - - createCookie({ - variables: { - input: { - cookieCategoryId: categoryId, - name: name.trim(), - duration: duration.trim(), - description: description.trim(), - }, - }, - onCompleted(_response, errors) { - if (errors?.length) { - const isConflict = errors.some( - e => (e as unknown as GraphQLError).extensions?.code === "CONFLICT", - ); - toast({ - title: __("Error"), - description: isConflict - ? __("A cookie with this name already exists in this banner") - : errors[0].message, - variant: "error", - }); - return; - } - toast({ title: __("Success"), description: __("Cookie added"), variant: "success" }); - dialogRef.current?.close(); - }, - onError(error) { - toast({ title: __("Error"), description: formatError(__("Failed to add cookie"), error as GraphQLError), variant: "error" }); - }, - }); - }; - - return ( - onOpenChange(false)} - title={__("Add Cookie")} - className="max-w-lg" - > -
- -
- - -
- - - setName(e.target.value)} required /> - - - - setDuration(e.target.value)} - required - placeholder={__("e.g. 1 year")} - /> - - - - setDescription(e.target.value)} required /> - - - - - - -
- - ); -} diff --git a/apps/console/src/pages/organizations/cookie-banners/configuration/cookies/_components/CategorySection.tsx b/apps/console/src/pages/organizations/cookie-banners/configuration/cookies/_components/CategorySection.tsx index 68fd26bcd..0077fd772 100644 --- a/apps/console/src/pages/organizations/cookie-banners/configuration/cookies/_components/CategorySection.tsx +++ b/apps/console/src/pages/organizations/cookie-banners/configuration/cookies/_components/CategorySection.tsx @@ -35,12 +35,12 @@ import { useState } from "react"; import { useFragment, useMutation } from "react-relay"; import { ConnectionHandler, graphql } from "relay-runtime"; -import type { CategorySectionCreateCookieMutation } from "#/__generated__/core/CategorySectionCreateCookieMutation.graphql"; -import type { CategorySectionDeleteCookieMutation } from "#/__generated__/core/CategorySectionDeleteCookieMutation.graphql"; +import type { CategorySectionCreatePatternMutation } from "#/__generated__/core/CategorySectionCreatePatternMutation.graphql"; +import type { CategorySectionDeletePatternMutation } from "#/__generated__/core/CategorySectionDeletePatternMutation.graphql"; import type { CategorySectionFragment$key } from "#/__generated__/core/CategorySectionFragment.graphql"; -import type { CategorySectionMoveCookieMutation } from "#/__generated__/core/CategorySectionMoveCookieMutation.graphql"; -import type { CategorySectionUpdateCookieMutation } from "#/__generated__/core/CategorySectionUpdateCookieMutation.graphql"; +import type { CategorySectionMovePatternMutation } from "#/__generated__/core/CategorySectionMovePatternMutation.graphql"; import type { CategorySectionUpdateMutation } from "#/__generated__/core/CategorySectionUpdateMutation.graphql"; +import type { CategorySectionUpdatePatternMutation } from "#/__generated__/core/CategorySectionUpdatePatternMutation.graphql"; import { AddCookieRow } from "./AddCookieRow"; import { EditCategoryForm } from "./EditCategoryForm"; @@ -61,14 +61,14 @@ export const categorySectionFragment = graphql` kind gcmConsentTypes posthogConsent - cookies(first: 100, orderBy: { field: CREATED_AT, direction: ASC }) - @connection(key: "CategorySection_cookies", filters: []) + cookiePatterns(first: 100, orderBy: { field: CREATED_AT, direction: ASC }) + @connection(key: "CategorySection_cookiePatterns", filters: []) @required(action: THROW) { __id edges { node { id - name + displayName duration description ...EditCookieRowFragment @@ -115,16 +115,16 @@ const updateCategoryMutation = graphql` } `; -const createCookieMutation = graphql` - mutation CategorySectionCreateCookieMutation( - $input: CreateCookieInput! +const createPatternMutation = graphql` + mutation CategorySectionCreatePatternMutation( + $input: CreateCookiePatternInput! $connections: [ID!]! ) { - createCookie(input: $input) { - cookieEdge @appendEdge(connections: $connections) { + createCookiePattern(input: $input) { + cookiePatternEdge @appendEdge(connections: $connections) { node { id - name + displayName duration description ...EditCookieRowFragment @@ -142,14 +142,14 @@ const createCookieMutation = graphql` } `; -const updateCookieMutation = graphql` - mutation CategorySectionUpdateCookieMutation( - $input: UpdateCookieInput! +const updatePatternMutation = graphql` + mutation CategorySectionUpdatePatternMutation( + $input: UpdateCookiePatternInput! ) { - updateCookie(input: $input) { - cookie { + updateCookiePattern(input: $input) { + cookiePattern { id - name + displayName duration description updatedAt @@ -166,13 +166,13 @@ const updateCookieMutation = graphql` } `; -const deleteCookieMutation = graphql` - mutation CategorySectionDeleteCookieMutation( - $input: DeleteCookieInput! +const deletePatternMutation = graphql` + mutation CategorySectionDeletePatternMutation( + $input: DeleteCookiePatternInput! $connections: [ID!]! ) { - deleteCookie(input: $input) { - deletedCookieId @deleteEdge(connections: $connections) + deleteCookiePattern(input: $input) { + deletedCookiePatternId @deleteEdge(connections: $connections) cookieBanner { id latestVersion { @@ -185,14 +185,14 @@ const deleteCookieMutation = graphql` } `; -const moveCookieMutation = graphql` - mutation CategorySectionMoveCookieMutation( - $input: MoveCookieToCategoryInput! +const movePatternMutation = graphql` + mutation CategorySectionMovePatternMutation( + $input: MoveCookiePatternToCategoryInput! ) { - moveCookieToCategory(input: $input) { - cookie { + moveCookiePatternToCategory(input: $input) { + cookiePattern { id - name + displayName duration description cookieCategory { @@ -224,22 +224,22 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) const [updateCategory, isUpdating] = useMutation(updateCategoryMutation); - const [createCookie, isCreating] - = useMutation(createCookieMutation); - const [updateCookie, isUpdatingCookie] - = useMutation(updateCookieMutation); - const [deleteCookie] - = useMutation(deleteCookieMutation); - const [moveCookie] - = useMutation(moveCookieMutation); + const [createPattern, isCreating] + = useMutation(createPatternMutation); + const [updatePattern, isUpdatingPattern] + = useMutation(updatePatternMutation); + const [deletePattern] + = useMutation(deletePatternMutation); + const [movePattern] + = useMutation(movePatternMutation); const [isEditingCategory, setIsEditingCategory] = useState(false); const [editingCookieId, setEditingCookieId] = useState(null); const [isAddingCookie, setIsAddingCookie] = useState(false); - const cookiesConnectionId = category.cookies.__id; - const cookies = category.cookies.edges.map(e => e.node); - const isMutating = isUpdating || isCreating || isUpdatingCookie; + const patternsConnectionId = category.cookiePatterns.__id; + const patterns = category.cookiePatterns.edges.map(e => e.node); + const isMutating = isUpdating || isCreating || isUpdatingPattern; const handleSaveCategory = ( name: string, slug: string, description: string, @@ -287,15 +287,17 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) const handleSaveNewCookie = (cookie: CookieEntry) => { if (!cookie.name.trim()) return; - createCookie({ + createPattern({ variables: { input: { cookieCategoryId: category.id, - name: cookie.name, + pattern: cookie.name, + matchType: "EXACT", + displayName: cookie.name, duration: cookie.duration, description: cookie.description, }, - connections: [cookiesConnectionId], + connections: [patternsConnectionId], }, onCompleted(_response, errors) { if (errors?.length) { @@ -331,13 +333,13 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) }); }; - const handleSaveEditCookie = (cookieId: string, cookie: CookieEntry) => { + const handleSaveEditCookie = (patternId: string, cookie: CookieEntry) => { if (!cookie.name.trim()) return; - updateCookie({ + updatePattern({ variables: { input: { - cookieId, - name: cookie.name, + cookiePatternId: patternId, + displayName: cookie.name, duration: cookie.duration, description: cookie.description, }, @@ -376,11 +378,11 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) }); }; - const handleDeleteCookie = (cookieId: string) => { - deleteCookie({ + const handleDeleteCookie = (patternId: string) => { + deletePattern({ variables: { - input: { cookieId }, - connections: [cookiesConnectionId], + input: { cookiePatternId: patternId }, + connections: [patternsConnectionId], }, onCompleted(_response, errors) { if (errors?.length) { @@ -413,11 +415,11 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) const allCategories = category.cookieBanner.categories.edges.map(e => e.node) ?? []; const siblingCategories = allCategories.filter(c => c.id !== category.id); - const handleMoveCookie = (cookieId: string, targetCategoryId: string) => { - moveCookie({ + const handleMoveCookie = (patternId: string, targetCategoryId: string) => { + movePattern({ variables: { input: { - cookieId, + cookiePatternId: patternId, targetCookieCategoryId: targetCategoryId, }, }, @@ -426,10 +428,10 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) if (sourceCategory) { const sourceConn = ConnectionHandler.getConnection( sourceCategory, - "CategorySection_cookies", + "CategorySection_cookiePatterns", ); if (sourceConn) { - ConnectionHandler.deleteNode(sourceConn, cookieId); + ConnectionHandler.deleteNode(sourceConn, patternId); } } @@ -437,16 +439,16 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) if (targetCategory) { const targetConn = ConnectionHandler.getConnection( targetCategory, - "CategorySection_cookies", + "CategorySection_cookiePatterns", ); if (targetConn) { - const cookieRecord = store.get(cookieId); - if (cookieRecord) { + const patternRecord = store.get(patternId); + if (patternRecord) { const newEdge = ConnectionHandler.createEdge( store, targetConn, - cookieRecord, - "CookieEdge", + patternRecord, + "CookiePatternEdge", ); ConnectionHandler.insertEdgeAfter(targetConn, newEdge); } @@ -573,34 +575,34 @@ export function CategorySection({ categoryKey, onDelete }: CategorySectionProps) - {cookies.map(cookie => - editingCookieId === cookie.id + {patterns.map(pattern => + editingCookieId === pattern.id ? ( handleSaveEditCookie(cookie.id, updated)} + onSave={updated => handleSaveEditCookie(pattern.id, updated)} onCancel={() => setEditingCookieId(null)} /> ) : ( - + - {cookie.name} + {pattern.displayName} - {cookie.duration} + {pattern.duration} - {cookie.description} + {pattern.description}