diff --git a/src/components/AspectRatio.tsx b/src/components/AspectRatio.tsx index b0132417..57896dbc 100644 --- a/src/components/AspectRatio.tsx +++ b/src/components/AspectRatio.tsx @@ -38,7 +38,9 @@ export const EmbedAspectRatio = styled.div<{ $aspectRatio: string }>( ) export const ImageAspectRatio = styled(EmbedAspectRatio)<{ $url: string }>( - ({ $url }) => ({ + ({ theme, $url }) => ({ + borderRadius: theme.borderRadiuses.large, + border: theme.borders['fill-three'], backgroundSize: 'cover', backgroundPosition: 'center', backgroundImage: `url(${$url})`, diff --git a/src/components/custom-page/BlogCards.tsx b/src/components/custom-page/BlogCards.tsx index 31017dd1..a9f1633c 100644 --- a/src/components/custom-page/BlogCards.tsx +++ b/src/components/custom-page/BlogCards.tsx @@ -1,5 +1,6 @@ import { type BlogCardsComponentFragment } from '@src/generated/graphqlDirectus' -export function BlogCards({ spacing }: BlogCardsComponentFragment) { - return
BlogCards
+export function BlogCards({ spacing: _spacing }: BlogCardsComponentFragment) { + // TODO + return null } diff --git a/src/components/custom-page/CallToAction.tsx b/src/components/custom-page/CallToAction.tsx index a3f64c8f..23597193 100644 --- a/src/components/custom-page/CallToAction.tsx +++ b/src/components/custom-page/CallToAction.tsx @@ -19,7 +19,7 @@ export function CallToAction({
{heading} diff --git a/src/components/custom-page/Cards.tsx b/src/components/custom-page/Cards.tsx index 8201e180..47ef4995 100644 --- a/src/components/custom-page/Cards.tsx +++ b/src/components/custom-page/Cards.tsx @@ -1,5 +1,74 @@ -import { type CardsComponentFragment } from '@src/generated/graphqlDirectus' +import { Card } from '@pluralsh/design-system' -export function Cards({ spacing }: CardsComponentFragment) { - return
Cards
+import styled from 'styled-components' + +import { getImageUrl } from '@src/consts/routes' +import { + type CardFragment, + type CardsComponentFragment, +} from '@src/generated/graphqlDirectus' +import { cn } from '@src/utils/cn' + +import { ImageAspectRatio } from '../AspectRatio' +import { Body2, OverlineLabel } from '../Typography' + +import { getSpacingClassName } from './common' + +export function Cards({ spacing, cards }: CardsComponentFragment) { + return ( +
+ {cards?.map((c) => c?.card_id && )} +
+ ) } + +export function CardComponent({ + image, + heading, + body_text: bodyText, + url, +}: CardFragment) { + return ( + + + {heading} + {bodyText} + + ) +} + +const CardComponentWrapperSC = styled(Card)<{ $clickable: boolean }>( + ({ theme, $clickable }) => ({ + display: 'flex', + flexDirection: 'column', + padding: theme.spacing.xlarge, + gap: theme.spacing.medium, + transition: 'border 0.16s ease-in-out', + ...($clickable + ? { + cursor: 'pointer', + '&:hover': { + border: theme.borders.selected, + }, + } + : {}), + }) +) diff --git a/src/components/custom-page/SectionHeader.tsx b/src/components/custom-page/SectionHeader.tsx index 0f0ace2b..a85a0b77 100644 --- a/src/components/custom-page/SectionHeader.tsx +++ b/src/components/custom-page/SectionHeader.tsx @@ -15,7 +15,7 @@ export function SectionHeader({
{overline && {overline}} diff --git a/src/generated/graphqlDirectus.ts b/src/generated/graphqlDirectus.ts index 759990fc..bdf496e1 100644 --- a/src/generated/graphqlDirectus.ts +++ b/src/generated/graphqlDirectus.ts @@ -34,6 +34,10 @@ export type Mutation = { create_blog_cards_items: Array; create_callouts_item?: Maybe; create_callouts_items: Array; + create_card_item?: Maybe; + create_card_items: Array; + create_cards_card_item?: Maybe; + create_cards_card_items: Array; create_cards_item?: Maybe; create_cards_items: Array; create_case_studies_item?: Maybe; @@ -126,6 +130,10 @@ export type Mutation = { delete_blog_cards_items?: Maybe; delete_callouts_item?: Maybe; delete_callouts_items?: Maybe; + delete_card_item?: Maybe; + delete_card_items?: Maybe; + delete_cards_card_item?: Maybe; + delete_cards_card_items?: Maybe; delete_cards_item?: Maybe; delete_cards_items?: Maybe; delete_case_studies_item?: Maybe; @@ -223,7 +231,13 @@ export type Mutation = { update_callouts_batch: Array; update_callouts_item?: Maybe; update_callouts_items: Array; + update_card_batch: Array; + update_card_item?: Maybe; + update_card_items: Array; update_cards_batch: Array; + update_cards_card_batch: Array; + update_cards_card_item?: Maybe; + update_cards_card_items: Array; update_cards_item?: Maybe; update_cards_items: Array; update_case_studies_batch: Array; @@ -422,6 +436,38 @@ export type MutationCreate_Callouts_ItemsArgs = { }; +export type MutationCreate_Card_ItemArgs = { + data: Create_Card_Input; +}; + + +export type MutationCreate_Card_ItemsArgs = { + data?: InputMaybe>; + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type MutationCreate_Cards_Card_ItemArgs = { + data: Create_Cards_Card_Input; +}; + + +export type MutationCreate_Cards_Card_ItemsArgs = { + data?: InputMaybe>; + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + export type MutationCreate_Cards_ItemArgs = { data: Create_Cards_Input; }; @@ -1134,6 +1180,26 @@ export type MutationDelete_Callouts_ItemsArgs = { }; +export type MutationDelete_Card_ItemArgs = { + id: Scalars['ID']['input']; +}; + + +export type MutationDelete_Card_ItemsArgs = { + ids: Array>; +}; + + +export type MutationDelete_Cards_Card_ItemArgs = { + id: Scalars['ID']['input']; +}; + + +export type MutationDelete_Cards_Card_ItemsArgs = { + ids: Array>; +}; + + export type MutationDelete_Cards_ItemArgs = { id: Scalars['ID']['input']; }; @@ -1675,6 +1741,35 @@ export type MutationUpdate_Callouts_ItemsArgs = { }; +export type MutationUpdate_Card_BatchArgs = { + data?: InputMaybe>; + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type MutationUpdate_Card_ItemArgs = { + data: Update_Card_Input; + id: Scalars['ID']['input']; +}; + + +export type MutationUpdate_Card_ItemsArgs = { + data: Update_Card_Input; + filter?: InputMaybe; + ids: Array>; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + export type MutationUpdate_Cards_BatchArgs = { data?: InputMaybe>; filter?: InputMaybe; @@ -1686,6 +1781,35 @@ export type MutationUpdate_Cards_BatchArgs = { }; +export type MutationUpdate_Cards_Card_BatchArgs = { + data?: InputMaybe>; + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type MutationUpdate_Cards_Card_ItemArgs = { + data: Update_Cards_Card_Input; + id: Scalars['ID']['input']; +}; + + +export type MutationUpdate_Cards_Card_ItemsArgs = { + data: Update_Cards_Card_Input; + filter?: InputMaybe; + ids: Array>; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + export type MutationUpdate_Cards_ItemArgs = { data: Update_Cards_Input; id: Scalars['ID']['input']; @@ -2937,9 +3061,15 @@ export type Query = { callouts: Array; callouts_aggregated: Array; callouts_by_id?: Maybe; + card: Array; + card_aggregated: Array; + card_by_id?: Maybe; cards: Array; cards_aggregated: Array; cards_by_id?: Maybe; + cards_card: Array; + cards_card_aggregated: Array; + cards_card_by_id?: Maybe; case_studies: Array; case_studies_aggregated: Array; case_studies_by_id?: Maybe; @@ -3176,6 +3306,32 @@ export type QueryCallouts_By_IdArgs = { }; +export type QueryCardArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type QueryCard_AggregatedArgs = { + filter?: InputMaybe; + groupBy?: InputMaybe>>; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type QueryCard_By_IdArgs = { + id: Scalars['ID']['input']; +}; + + export type QueryCardsArgs = { filter?: InputMaybe; limit?: InputMaybe; @@ -3202,6 +3358,32 @@ export type QueryCards_By_IdArgs = { }; +export type QueryCards_CardArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type QueryCards_Card_AggregatedArgs = { + filter?: InputMaybe; + groupBy?: InputMaybe>>; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type QueryCards_Card_By_IdArgs = { + id: Scalars['ID']['input']; +}; + + export type QueryCase_StudiesArgs = { filter?: InputMaybe; limit?: InputMaybe; @@ -4716,8 +4898,103 @@ export type Callouts_Filter = { user_updated?: InputMaybe; }; +export type Card = { + __typename?: 'card'; + body_text: Scalars['String']['output']; + date_created?: Maybe; + date_created_func?: Maybe; + date_updated?: Maybe; + date_updated_func?: Maybe; + heading: Scalars['String']['output']; + id: Scalars['ID']['output']; + image?: Maybe; + url?: Maybe; + user_created?: Maybe; + user_updated?: Maybe; +}; + + +export type CardImageArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type CardUser_CreatedArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type CardUser_UpdatedArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + +export type Card_Aggregated = { + __typename?: 'card_aggregated'; + avg?: Maybe; + avgDistinct?: Maybe; + count?: Maybe; + countAll?: Maybe; + countDistinct?: Maybe; + group?: Maybe; + max?: Maybe; + min?: Maybe; + sum?: Maybe; + sumDistinct?: Maybe; +}; + +export type Card_Aggregated_Count = { + __typename?: 'card_aggregated_count'; + body_text?: Maybe; + date_created?: Maybe; + date_updated?: Maybe; + heading?: Maybe; + id?: Maybe; + image?: Maybe; + url?: Maybe; + user_created?: Maybe; + user_updated?: Maybe; +}; + +export type Card_Aggregated_Fields = { + __typename?: 'card_aggregated_fields'; + id?: Maybe; +}; + +export type Card_Filter = { + _and?: InputMaybe>>; + _or?: InputMaybe>>; + body_text?: InputMaybe; + date_created?: InputMaybe; + date_created_func?: InputMaybe; + date_updated?: InputMaybe; + date_updated_func?: InputMaybe; + heading?: InputMaybe; + id?: InputMaybe; + image?: InputMaybe; + url?: InputMaybe; + user_created?: InputMaybe; + user_updated?: InputMaybe; +}; + export type Cards = { __typename?: 'cards'; + cards?: Maybe>>; + cards_func?: Maybe; date_created?: Maybe; date_created_func?: Maybe; date_updated?: Maybe; @@ -4729,6 +5006,16 @@ export type Cards = { }; +export type CardsCardsArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + export type CardsUser_CreatedArgs = { filter?: InputMaybe; limit?: InputMaybe; @@ -4764,6 +5051,7 @@ export type Cards_Aggregated = { export type Cards_Aggregated_Count = { __typename?: 'cards_aggregated_count'; + cards?: Maybe; date_created?: Maybe; date_updated?: Maybe; id?: Maybe; @@ -4777,9 +5065,74 @@ export type Cards_Aggregated_Fields = { id?: Maybe; }; +export type Cards_Card = { + __typename?: 'cards_card'; + card_id?: Maybe; + cards_id?: Maybe; + id: Scalars['ID']['output']; +}; + + +export type Cards_CardCard_IdArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + + +export type Cards_CardCards_IdArgs = { + filter?: InputMaybe; + limit?: InputMaybe; + offset?: InputMaybe; + page?: InputMaybe; + search?: InputMaybe; + sort?: InputMaybe>>; +}; + +export type Cards_Card_Aggregated = { + __typename?: 'cards_card_aggregated'; + avg?: Maybe; + avgDistinct?: Maybe; + count?: Maybe; + countAll?: Maybe; + countDistinct?: Maybe; + group?: Maybe; + max?: Maybe; + min?: Maybe; + sum?: Maybe; + sumDistinct?: Maybe; +}; + +export type Cards_Card_Aggregated_Count = { + __typename?: 'cards_card_aggregated_count'; + card_id?: Maybe; + cards_id?: Maybe; + id?: Maybe; +}; + +export type Cards_Card_Aggregated_Fields = { + __typename?: 'cards_card_aggregated_fields'; + card_id?: Maybe; + cards_id?: Maybe; + id?: Maybe; +}; + +export type Cards_Card_Filter = { + _and?: InputMaybe>>; + _or?: InputMaybe>>; + card_id?: InputMaybe; + cards_id?: InputMaybe; + id?: InputMaybe; +}; + export type Cards_Filter = { _and?: InputMaybe>>; _or?: InputMaybe>>; + cards?: InputMaybe; + cards_func?: InputMaybe; date_created?: InputMaybe; date_created_func?: InputMaybe; date_updated?: InputMaybe; @@ -5544,7 +5897,26 @@ export type Create_Callouts_Input = { user_updated?: InputMaybe; }; +export type Create_Card_Input = { + body_text: Scalars['String']['input']; + date_created?: InputMaybe; + date_updated?: InputMaybe; + heading: Scalars['String']['input']; + id?: InputMaybe; + image?: InputMaybe; + url?: InputMaybe; + user_created?: InputMaybe; + user_updated?: InputMaybe; +}; + +export type Create_Cards_Card_Input = { + card_id?: InputMaybe; + cards_id?: InputMaybe; + id?: InputMaybe; +}; + export type Create_Cards_Input = { + cards?: InputMaybe>>; date_created?: InputMaybe; date_updated?: InputMaybe; id?: InputMaybe; @@ -9859,7 +10231,26 @@ export type Update_Callouts_Input = { user_updated?: InputMaybe; }; +export type Update_Card_Input = { + body_text?: InputMaybe; + date_created?: InputMaybe; + date_updated?: InputMaybe; + heading?: InputMaybe; + id?: InputMaybe; + image?: InputMaybe; + url?: InputMaybe; + user_created?: InputMaybe; + user_updated?: InputMaybe; +}; + +export type Update_Cards_Card_Input = { + card_id?: InputMaybe; + cards_id?: InputMaybe; + id?: InputMaybe; +}; + export type Update_Cards_Input = { + cards?: InputMaybe>>; date_created?: InputMaybe; date_updated?: InputMaybe; id?: InputMaybe; @@ -10574,7 +10965,7 @@ export type SolutionsQueryVariables = Exact<{ export type SolutionsQuery = { __typename?: 'Query', solutions_pages: Array<{ __typename?: 'solutions_pages', id: string, slug: string, title?: string | null, description?: string | null, upper_features_title?: string | null, lower_features_title?: string | null, download_section_title?: string | null, download_section_description?: string | null, upper_features?: Array<{ __typename?: 'solution_features', id: string, title?: string | null, description?: string | null, icon?: string | null, link_title?: string | null, link_url?: string | null } | null> | null, lower_features?: Array<{ __typename?: 'solution_features', id: string, title?: string | null, description?: string | null, icon?: string | null, link_title?: string | null, link_url?: string | null } | null> | null, problems?: Array<{ __typename?: 'solution_problems', id: string, title?: string | null, subtitle?: string | null, problem?: string | null, solution?: string | null } | null> | null, featured_quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null }> }; -export type CustomPageFragment = { __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'blog_cards', spacing?: string | null } | { __typename?: 'cards', spacing?: string | null } | { __typename?: 'cta', spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }; +export type CustomPageFragment = { __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'blog_cards', spacing?: string | null } | { __typename?: 'cards', spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | { __typename?: 'cta', spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }; export type CustomPageTinyFragment = { __typename?: 'custom_pages', id: string, slug: string }; @@ -10588,7 +10979,7 @@ export type CustomPageQueryVariables = Exact<{ }>; -export type CustomPageQuery = { __typename?: 'Query', custom_pages: Array<{ __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'blog_cards', spacing?: string | null } | { __typename?: 'cards', spacing?: string | null } | { __typename?: 'cta', spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }> }; +export type CustomPageQuery = { __typename?: 'Query', custom_pages: Array<{ __typename?: 'custom_pages', id: string, slug: string, components?: Array<{ __typename?: 'custom_pages_components', collection?: string | null, item?: { __typename?: 'blog_cards', spacing?: string | null } | { __typename?: 'cards', spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | { __typename?: 'cta', spacing?: string | null, heading?: string | null, body_text?: string | null, cta_text?: string | null, cta_url?: string | null } | { __typename?: 'customer_quote', spacing?: string | null, quote?: { __typename?: 'quotes', id: string, quote?: string | null, author_text?: string | null } | null } | { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | { __typename?: 'logo_strip', spacing?: string | null, logo_list?: { __typename?: 'company_logo_lists', slug?: string | null, logos?: Array<{ __typename?: 'company_logo_lists_company_logos', company_logos_id?: { __typename?: 'company_logos', slug?: string | null, name: string, url?: string | null, logo_light?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null, logo_dark?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null } | null } | { __typename?: 'multi_column_text', spacing?: string | null, columns?: Array<{ __typename?: 'multi_column_text_rich_text_columns', rich_text_columns_id?: { __typename?: 'rich_text_columns', icon?: string | null, heading?: string | null, body_text: string } | null } | null> | null } | { __typename?: 'section_header', spacing?: string | null, overline?: string | null, title?: string | null, description?: string | null } | { __typename?: 'two_column_text', spacing?: string | null, main_content: string, side_content: string } | null } | null> | null }> }; export type HeroComponentFragment = { __typename?: 'hero', spacing?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; @@ -10598,7 +10989,9 @@ export type SectionHeaderComponentFragment = { __typename?: 'section_header', sp export type LargeImageComponentFragment = { __typename?: 'large_image', spacing?: string | null, overline?: string | null, heading?: string | null, body_text?: string | null, media_type?: string | null, video_url?: string | null, form?: string | null, cta_text?: string | null, cta_url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; -export type CardsComponentFragment = { __typename?: 'cards', spacing?: string | null }; +export type CardFragment = { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null }; + +export type CardsComponentFragment = { __typename?: 'cards', spacing?: string | null, cards?: Array<{ __typename?: 'cards_card', card_id?: { __typename?: 'card', heading: string, body_text: string, url?: string | null, image?: { __typename?: 'directus_files', id: string, title?: string | null, description?: string | null, tags?: any | null, filename_disk?: string | null, filename_download: string, metadata?: any | null, type?: string | null, filesize?: any | null } | null } | null } | null> | null }; export type BlogCardsComponentFragment = { __typename?: 'blog_cards', spacing?: string | null }; @@ -11001,11 +11394,26 @@ export const MultiColumnTextComponentFragmentDoc = gql` } } ${RichTextColumnFragmentDoc}`; +export const CardFragmentDoc = gql` + fragment Card on card { + image { + ...ImageFile + } + heading + body_text + url +} + ${ImageFileFragmentDoc}`; export const CardsComponentFragmentDoc = gql` fragment CardsComponent on cards { spacing + cards { + card_id { + ...Card + } + } } - `; + ${CardFragmentDoc}`; export const BlogCardsComponentFragmentDoc = gql` fragment BlogCardsComponent on blog_cards { spacing diff --git a/src/graph/directus/customPages.graphql b/src/graph/directus/customPages.graphql index 95f0e874..4e772a7e 100644 --- a/src/graph/directus/customPages.graphql +++ b/src/graph/directus/customPages.graphql @@ -78,8 +78,22 @@ fragment LargeImageComponent on large_image { cta_url } +fragment Card on card { + image { + ...ImageFile + } + heading + body_text + url +} + fragment CardsComponent on cards { spacing + cards { + card_id { + ...Card + } + } } fragment BlogCardsComponent on blog_cards {