diff --git a/uix-focal-point-input/uix.js b/uix-focal-point-input/uix.js index 9fd21540..ff1ff923 100644 --- a/uix-focal-point-input/uix.js +++ b/uix-focal-point-input/uix.js @@ -1,25 +1,25 @@ console.log(window.GCUIX); const declaration = { - extensionType: "field", - fieldType: "JSON", - name: "Asset Focal point", - description: "", - features: ["FieldRenderer", "TableRenderer"], + extensionType: 'field', + fieldType: 'JSON', + name: 'Asset Focal point', + description: '', + features: ['FieldRenderer', 'TableRenderer'], }; -const originalImage = document.getElementById("originalImage"); -const preview_1_1 = document.getElementById("preview-1-1"); -const preview_1_2 = document.getElementById("preview-1-2"); -const preview_2_1 = document.getElementById("preview-2-1"); -const coords = document.getElementById("coords"); -const expandButton = document.getElementById("expand"); +const originalImage = document.getElementById('originalImage'); +const preview_1_1 = document.getElementById('preview-1-1'); +const preview_1_2 = document.getElementById('preview-1-2'); +const preview_2_1 = document.getElementById('preview-2-1'); +const coords = document.getElementById('coords'); +const expandButton = document.getElementById('expand'); let isExpanded = false; function updateExpandButton() { - expandButton.innerText = isExpanded ? "Collapse" : "Expand"; + expandButton.innerText = isExpanded ? 'Collapse' : 'Expand'; } -document.addEventListener("DOMContentLoaded", () => { +document.addEventListener('DOMContentLoaded', () => { try { window.GCUIX.init({ declaration, @@ -37,7 +37,7 @@ document.addEventListener("DOMContentLoaded", () => { }, }).then((initialState) => { const { status, props } = initialState; - if (status === "ok") { + if (status === 'ok') { const { value, onChange, @@ -51,26 +51,26 @@ document.addEventListener("DOMContentLoaded", () => { } = props; if (isTableCell) { - document.body.classList.add("isTableCell"); + document.body.classList.add('isTableCell'); return; } - if (model.apiId !== "Asset") { + if (model.apiId !== 'Asset') { throw new Error( - "The Focal Point UI extension is meant to be used only on the Asset model", + 'The Focal Point UI extension is meant to be used only on the Asset model' ); } if (field.isLocalized === false) { - throw new Error("Focal Point field must be localized"); + throw new Error('Focal Point field must be localized'); } - expandButton.addEventListener("click", () => { + expandButton.addEventListener('click', () => { expand(!isExpanded); if (!isExpanded) { - document.body.classList.add("fullScreen"); + document.body.classList.add('fullScreen'); } else { - document.body.classList.remove("fullScreen"); + document.body.classList.remove('fullScreen'); } }); @@ -78,18 +78,18 @@ document.addEventListener("DOMContentLoaded", () => { `localization_${locale}.file`, ({ value }) => { const currentUrl = value?.handle - ? `https://media.graphcms.com/${value.handle}` - : "https://via.placeholder.com/900x675?text=This+is+a+placeholder+image"; + ? `https://media.graphassets.com/${value.handle}` + : 'https://via.placeholder.com/900x675?text=This+is+a+placeholder+image'; [originalImage, preview_1_1, preview_1_2, preview_2_1].forEach( (img) => { - if (img.getAttribute("src") !== currentUrl) { - img.setAttribute("src", currentUrl); + if (img.getAttribute('src') !== currentUrl) { + img.setAttribute('src', currentUrl); } - }, + } ); }, - { value: true }, + { value: true } ); makeFocalPoint(value || undefined, onChange, isReadOnly); diff --git a/using-asset-upload/assets.json b/using-asset-upload/assets.json index dfb38786..31339f0e 100644 --- a/using-asset-upload/assets.json +++ b/using-asset-upload/assets.json @@ -1,11 +1,11 @@ [ { - "url": "https://media.graphcms.com/4XwHOQnTeii4YaCOsexQ" + "url": "https://media.graphassets.com/4XwHOQnTeii4YaCOsexQ" }, { - "url": "https://media.graphcms.com/YwaUel0gShOU6zPmP966" + "url": "https://media.graphassets.com/YwaUel0gShOU6zPmP966" }, { - "url": "https://media.graphcms.com/fGA5ZflbQQ2Kdsr8waSn" + "url": "https://media.graphassets.com/fGA5ZflbQQ2Kdsr8waSn" } ] diff --git a/with-graphql-mesh/README.md b/with-graphql-mesh/README.md index 65c29708..f214ddf3 100644 --- a/with-graphql-mesh/README.md +++ b/with-graphql-mesh/README.md @@ -26,8 +26,8 @@ npm start
Example query - - Fetch products from GraphCMS, a cart from CartQL, and recent Space X launches in one request: + +Fetch products from GraphCMS, a cart from CartQL, and recent Space X launches in one request: ```graphql { @@ -94,7 +94,7 @@ npm start } ], "image": { - "url": "https://media.graphcms.com/1bKpf5ihQpyEeRWXn8cg" + "url": "https://media.graphassets.com/1bKpf5ihQpyEeRWXn8cg" } }, { @@ -108,7 +108,7 @@ npm start } ], "image": { - "url": "https://media.graphcms.com/hmQEPi4NR4ygnMGvRmFB" + "url": "https://media.graphassets.com/hmQEPi4NR4ygnMGvRmFB" } }, { @@ -122,7 +122,7 @@ npm start } ], "image": { - "url": "https://media.graphcms.com/DhwyUSxTTA6q9GjXBLsa" + "url": "https://media.graphassets.com/DhwyUSxTTA6q9GjXBLsa" } } ], diff --git a/with-nextjs-image-loader/next.config.js b/with-nextjs-image-loader/next.config.js index 2573d7f1..a356e212 100644 --- a/with-nextjs-image-loader/next.config.js +++ b/with-nextjs-image-loader/next.config.js @@ -1,5 +1,5 @@ module.exports = { images: { - domains: ['media.graphcms.com'], + domains: ['media.graphassets.com'], }, }; diff --git a/with-nextjs-image-loader/pages/index.js b/with-nextjs-image-loader/pages/index.js index 00f8c626..71031c56 100644 --- a/with-nextjs-image-loader/pages/index.js +++ b/with-nextjs-image-loader/pages/index.js @@ -4,7 +4,9 @@ import { GraphQLClient, gql } from 'graphql-request'; function GraphCMSImageLoader({ src, width }) { const relativeSrc = (src) => src.split('/').pop(); - return `https://media.graphcms.com/resize=width:${width}/${relativeSrc(src)}`; + return `https://media.graphassets.com/resize=width:${width}/${relativeSrc( + src + )}`; } function IndexPage({ products }) { diff --git a/with-nextjs-image/next.config.js b/with-nextjs-image/next.config.js index 2573d7f1..a356e212 100644 --- a/with-nextjs-image/next.config.js +++ b/with-nextjs-image/next.config.js @@ -1,5 +1,5 @@ module.exports = { images: { - domains: ['media.graphcms.com'], + domains: ['media.graphassets.com'], }, }; diff --git a/with-swr/README.md b/with-swr/README.md index faaf330b..ecc4f565 100644 --- a/with-swr/README.md +++ b/with-swr/README.md @@ -10,7 +10,7 @@ NextAuth.js has a [REST API](https://next-auth.js.org/getting-started/rest-api) • [Demo](https://graphcms-with-swr.vercel.app/) -[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FGraphCMS%2Fgraphcms-examples%2Ftree%2Fmaster%2Fwith-swr&env=GRAPHCMS_ENDPOINT,GRAPHCMS_TOKEN,NEXTAUTH_URL,NEXTAUTH_SECRET&demo-title=User%20Todo%20App%20Demo&demo-description=A%20todo%20app%20powered%20by%20Next.js%2C%20GraphQL%2C%20and%20useSWR&demo-url=https%3A%2F%2Fgraphcms-with-swr.vercel.app&demo-image=https%3A%2F%2Fmedia.graphcms.com%2FG8ESmbV9RfunqtEXx5hy) [![Clone project](https://graphcms.com/button)](https://app.graphcms.com/clone/0ff23f7a41ce4da69a366ab299cc24d8) +[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FGraphCMS%2Fgraphcms-examples%2Ftree%2Fmaster%2Fwith-swr&env=GRAPHCMS_ENDPOINT,GRAPHCMS_TOKEN,NEXTAUTH_URL,NEXTAUTH_SECRET&demo-title=User%20Todo%20App%20Demo&demo-description=A%20todo%20app%20powered%20by%20Next.js%2C%20GraphQL%2C%20and%20useSWR&demo-url=https%3A%2F%2Fgraphcms-with-swr.vercel.app&demo-image=https%3A%2F%2Fmedia.graphassets.com%2FG8ESmbV9RfunqtEXx5hy) [![Clone project](https://graphcms.com/button)](https://app.graphcms.com/clone/0ff23f7a41ce4da69a366ab299cc24d8) ## How to Use