From 0ff95710f9ed4622138ecce9951e11a712969f96 Mon Sep 17 00:00:00 2001 From: Erroneous0ne Date: Fri, 10 Oct 2025 15:00:54 +0300 Subject: [PATCH] frontify-component --- assets/img/components/icons/frontify.png | Bin 0 -> 3385 bytes content/_components/frontify/index.md | 211 ++++++++++++++++++ .../_components/frontify/technical-notes.md | 21 ++ 3 files changed, 232 insertions(+) create mode 100644 assets/img/components/icons/frontify.png create mode 100644 content/_components/frontify/index.md create mode 100644 content/_components/frontify/technical-notes.md diff --git a/assets/img/components/icons/frontify.png b/assets/img/components/icons/frontify.png new file mode 100644 index 0000000000000000000000000000000000000000..886d8c00bc6574bdaa4fba56d5c5bc1ecbc6be87 GIT binary patch literal 3385 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 literal 0 HcmV?d00001 diff --git a/content/_components/frontify/index.md b/content/_components/frontify/index.md new file mode 100644 index 00000000..7f875d23 --- /dev/null +++ b/content/_components/frontify/index.md @@ -0,0 +1,211 @@ +--- +layout: component +title: Frontify component +section: Marketing-related components +description: The Frontify component enables you to integrate with your Frontify account. +icon: frontify.png +icontext: Frontify component +category: frontify +ComponentVersion: 1.0.0 +updatedDate: 2025-10-10 +--- + +## Table of Contents + +* [Description](#description) +* [Credentials](#credentials) +* [Actions](#actions) + * [Execute Mutation](#execute-mutation) + * [Lookup Objects (plural)](#lookup-objects-plural) + * [Lookup Object By ID](#lookup-object-by-id) + * [Make Raw Request](#make-raw-request) +* [Triggers](#triggers) + * [Webhook](#webhook) +* [Known Limitations](#known-limitations) + +## Description + +The Frontify component enables you to integrate with your Frontify account. It allows you to interact with brand assets, guidelines, and projects stored in Frontify through the [GraphQL API](https://developer.frontify.com/d/xJoA5nhTq1AT/graphql-api#/introduction/graphql-api). + +## Credentials +To embark on building any integration flow, the initial step involves creating an app by following these steps: + +1. Log in to your Frontify account (e.g., `https://.frontify.com`). +2. Navigate to **Account Settings → Developer → Applications**. +3. Click **Add Application** and provide: + - **Name** – a descriptive name for your app. + - **Redirect URI** – the callback URL as `https://{your-tenant-address}/callback/oauth2`. + - **Confidential** - enable this option. + - **Scopes** – select the scopes that your integration requires (at minimum, `basic:read`). +4. After saving, Frontify generates a **Client ID** and a **Client Secret**. + +With the app created, proceed to generate new credentials for the component: + +* **Type** (dropdown, required) - `OAuth2` +* **Choose Auth Client** (dropdown, required) - choose from previously created clients or select `Add New Auth Client`: + * **Name** (string, required) - Assign any desired name. + * **Client ID** (string, required) - Enter the `Client ID` from your Frontify app. + * **Client Secret** (string, required) - Enter the `Client Secret` from your Frontify app. + * **Authorization Endpoint** (string, required) - Use Frontify's OAuth2 authorization endpoint `https://.frontify.com/api/oauth/authorize`. + * **Token Endpoint** (string, required) - Use Frontify's refresh token endpoint `https://.frontify.com/api/oauth/accesstoken`. +* **Name Your Credential** (string, required) - Choose any name you prefer. +* **Scopes (Comma-separated list)** (string, required) - Specify the scopes to access your Frontify objects, e.g., `basic:read, basic:write`. You should enter the exact same scopes you selected when creating your Frontify application. For more information on scopes, see the [Frontify API scope documentation](https://developer.frontify.com/d/xJoA5nhTq1AT/graphql-api#/access-control/scopes-p11876). To successfully verify credentials, a minimum of `basic:read` is required. +* **Additional parameters (Comma-separated list)** (string, required) - Leave this field blank. +* **Base URL** (string, required) - Your Frontify domain (e.g., `https://mycompany.frontify.com`). +* **Version** (dropdown, optional, defaults to `v1`) - Choose either `v1` or `v2(beta)`. + +## Actions + +### Execute mutation + +Execute any mutation available in the Frontify GraphQL API. +This action can be used to **create**, **update**, or **delete** objects, as well as perform any other operation that modifies Frontify data. + +#### Configuration Fields + +* **Mutation type** - (dropdown, required): The mutation type to execute. E.g `Create Asset`. +* **Select basic fields for resulting object** - (dropdown, optional): A predefined set of common fields that can be included in the resulting object. Reducing the number of fields can lower the query cost. +* **You can provide additional fields here** - (string, optional): You can manually specify extra fields to include in the resulting object. Be aware that adding many fields may increase query cost. + +Example for Update Asset: + ``` + asset { + id + description + } + ``` + +> Special Notes for `Upload File` Mutation: +> +>* Required fields: + - **File URL** (string, required): The URL of the file to upload. Can be either an external public URL or an internal Maestar storage URL. + - **Size** (string, required): File size in bytes. + - **Filename** (string, required): Name of the file. +>* The action will automatically split the file into chunks and upload each part to Frontify using presigned URLs returned by the mutation. + +#### Input Metadata + +Dynamically generated fields according to chosen `Mutation type`. + +#### Output Metadata + +Result object from executed mutation. + +### Lookup Objects (plural) + +Lookup a set of objects based on defined criteria. +The results can be emitted either as a page or as individual objects. + +#### Configuration Fields + +* **Object Type** - (dropdown, required): The type of object to look up. E.g `Brands`. +* **Select basic fields for resulting object** - (dropdown, optional): A predefined set of common fields that can be included in the resulting object. Reducing the number of fields can lower the query cost. +* **You can provide additional fields here** - (string, optional): You can manually specify extra fields to include in the resulting object. Be aware that adding many fields may increase query cost. + +Example for Brands: + + ``` + rgbaColor { + red + alpha + } + ``` + +* **Emit Behavior** - (dropdown, required): Defines how the result objects will be emitted: + + - Emit page – All results are returned together in one array under the key `results`. + - Emit individually – Each object is returned in its own message. + +#### Input Metadata + +Dynamically generated fields according to the chosen `Object type`. + +#### Output Metadata + +For `Emit Page` mode: An object with key `results` that has an array as its value. + +For `Emit Individually` mode: Each object that fills the entire message. + +### Lookup Object By ID + +Lookup a single object by its ID. + +#### Configuration Fields + +* **Object Type** - (dropdown, required): The type of object to look up. +* **Select basic fields for resulting object** - (dropdown, optional): A predefined set of common fields that can be included in the resulting object. Reducing the number of fields can lower the query cost. +* **You can provide additional fields here** - (string, optional): You can manually specify extra fields to include in the resulting object. Be aware that adding many fields may increase query cost. + +Example for Brand: + ``` + libraries { + total + } + ``` + +#### Input Metadata + +* **ID Value** - (string, required): The ID of the object to lookup. + +#### Output Metadata + +Dynamically generated fields according to the chosen `Object type` and selected fields. + +### Make Raw Request + +Executes custom requests using the Frontify GraphQL API. + +#### Configuration Fields + +None. + +#### Input Metadata + +* **Request Body** - (object, optional): Provide the request body. + +Example Request Body: + +``` json + "query": "{ currentUser { ... on AccountUser { id email avatar name } } }" +``` + +[Frontify API reference](https://frontify.github.io/graphql-reference/) + +#### Output Metadata + +* **Status Code** - (number, required): The HTTP status code of the response. +* **HTTP headers** - (object, required): The response's HTTP headers. +* **Response Body** - (object, optional): The body of the HTTP response. + +## Triggers + +### Webhook + +Creates a subscription to selected events. + +Required scopes: `basic:write`, `webhooks:read`, `webhooks:write`. + +More information can be found on [Frontify Webhooks Docs](https://developer.frontify.com/d/xJoA5nhTq1AT/webhooks#/general/frontify-webhooks-1). + +#### Configuration Fields + +* **Project Id** - (string, required): Specify the project ID. +* **Name** - (string, required): Specify the name for the subscription. +* **Events** - (dropdown, required): Select the events that will trigger this webhook. + * For `v1`, only subscription to all events is possible. + * For `v2(beta)`, specific [event types](https://developer.frontify.com/d/xJoA5nhTq1AT/webhooks#/webhook-events/asset-events) can be chosen. + +#### Input Metadata + +None. + +#### Output Metadata + +An object with the key [event](https://developer.frontify.com/d/xJoA5nhTq1AT/webhooks#/webhook-events/event-format-1) that describes changes. + +## Known Limitations + +* The `Webhook` trigger can only work in a real-time flow. +* Frontify does not guarantee the order in which you receive a webhook for a specific event. +* Occasionally it might happen that you receive the same event multiple times. +* `Retrieving a new sample` for the webhook will not work because the webhook requires a valid event signature. Only events sent by Frontify contain a valid signature. \ No newline at end of file diff --git a/content/_components/frontify/technical-notes.md b/content/_components/frontify/technical-notes.md new file mode 100644 index 00000000..61df78ec --- /dev/null +++ b/content/_components/frontify/technical-notes.md @@ -0,0 +1,21 @@ +--- +layout: component +title: Fontify Technical Notes +description: Technical Notes for Frontify component. +icon: frontify.png +icontext: Frontify component +category: frontify +ComponentVersion: 1.0.0 +updatedDate: 2025-10-10 +--- + +## Changelog + +### 1.0.0 (October 10, 2025) + +* Added `Execute Mutation` Action +* Added `Lookup Object By ID` Action +* Added `Lookup Objects (plural)` Action +* Added `Make Raw Request` Action +* Added `Webhook` Trigger +* Initial component release \ No newline at end of file