musora-content-services 2.3.2 → 2.3.3

package/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [2.3.3](https://github.com/railroadmedia/musora-content-services/compare/v2.3.2...v2.3.3) (2025-04-02)
+
 ### [2.3.2](https://github.com/railroadmedia/musora-content-services/compare/v2.3.1...v2.3.2) (2025-03-31)
 
 ### [2.3.1](https://github.com/railroadmedia/musora-content-services/compare/v2.3.0...v2.3.1) (2025-03-31)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "musora-content-services",
-  "version": "2.3.2",
+  "version": "2.3.3",
   "description": "A package for Musoras content services ",
   "main": "src/index.js",
   "type": "module",

package/src/index.d.ts

@@ -55,6 +55,18 @@ import {
 	fetchAwardsForUser
 } from './services/gamification/awards.js';
 
+import {
+	applyCloudflareWrapper,
+	applySanityTransformations,
+	buildImageSRC
+} from './services/imageSRCBuilder.js';
+
+import {
+	extractSanityUrl,
+	isBucketUrl,
+	verifyImageSRC
+} from './services/imageSRCVerify.js';
+
 import {
 	assignModeratorToComment,
 	closeComment,
@@ -214,10 +226,13 @@ import {
 declare module 'musora-content-services' {
 	export {
 		addItemToPlaylist,
+		applyCloudflareWrapper,
+		applySanityTransformations,
 		assignModeratorToComment,
 		assignmentStatusCompleted,
 		assignmentStatusReset,
 		blockUser,
+		buildImageSRC,
 		closeComment,
 		contentStatusCompleted,
 		contentStatusReset,
@@ -231,6 +246,7 @@ declare module 'musora-content-services' {
 		deletePracticeSession,
 		duplicatePlaylist,
 		editComment,
+		extractSanityUrl,
 		fetchAll,
 		fetchAllCompletedStates,
 		fetchAllFilterOptions,
@@ -334,6 +350,7 @@ declare module 'musora-content-services' {
 		getUserWeeklyStats,
 		globalConfig,
 		initializeService,
+		isBucketUrl,
 		isContentLiked,
 		jumpToContinueContent,
 		likeComment,
@@ -378,6 +395,7 @@ declare module 'musora-content-services' {
 		updatePlaylist,
 		updatePlaylistItem,
 		updateUserPractice,
+		verifyImageSRC,
 		verifyLocalDataContext,
 	}
 }

package/src/index.js

@@ -55,6 +55,18 @@ import {
 	fetchAwardsForUser
 } from './services/gamification/awards.js';
 
+import {
+	applyCloudflareWrapper,
+	applySanityTransformations,
+	buildImageSRC
+} from './services/imageSRCBuilder.js';
+
+import {
+	extractSanityUrl,
+	isBucketUrl,
+	verifyImageSRC
+} from './services/imageSRCVerify.js';
+
 import {
 	assignModeratorToComment,
 	closeComment,
@@ -213,10 +225,13 @@ import {
 
 export {
 	addItemToPlaylist,
+	applyCloudflareWrapper,
+	applySanityTransformations,
 	assignModeratorToComment,
 	assignmentStatusCompleted,
 	assignmentStatusReset,
 	blockUser,
+	buildImageSRC,
 	closeComment,
 	contentStatusCompleted,
 	contentStatusReset,
@@ -230,6 +245,7 @@ export {
 	deletePracticeSession,
 	duplicatePlaylist,
 	editComment,
+	extractSanityUrl,
 	fetchAll,
 	fetchAllCompletedStates,
 	fetchAllFilterOptions,
@@ -333,6 +349,7 @@ export {
 	getUserWeeklyStats,
 	globalConfig,
 	initializeService,
+	isBucketUrl,
 	isContentLiked,
 	jumpToContinueContent,
 	likeComment,
@@ -377,5 +394,6 @@ export {
 	updatePlaylist,
 	updatePlaylistItem,
 	updateUserPractice,
+	verifyImageSRC,
 	verifyLocalDataContext,
 };

package/src/services/imageSRCBuilder.js

@@ -0,0 +1,139 @@
+/**
+ * Builds an optimized image URL using both Sanity and Cloudflare Image Resizing services
+ *
+ * This function takes a Sanity CDN URL and image transformation parameters, then:
+ * 1. Adds appropriate transformation parameters to the Sanity URL
+ * 2. Wraps the resulting URL with Cloudflare's Image Resizing service
+ * 3. Maps compatible parameters between the two services for optimal results
+ *
+ * @param {string} url - The original image URL, typically from Sanity CDN
+ * @param {Object} options - Image transformation options
+ * @param {number} [options.width] - Desired image width in pixels
+ * @param {number} [options.height] - Desired image height in pixels
+ * @param {number} [options.quality] - Image quality (1-100)
+ * @param {string} [options.fit] - Resize strategy: 'cover', 'contain', 'scale-down', 'none'
+ * @param {string} [options.gravity] - Content positioning: 'auto', 'top', 'bottom', 'left', 'right', etc.
+ * @param {string} [options.crop] - Sanity-specific crop mode
+ * @param {string} [options.format] - Image format: 'auto', 'webp', 'jpeg', 'png', etc.
+ * @param {number} [options.blur] - Blur amount
+ * @param {number} [options.sharpen] - Sharpen amount
+ * @param {number} [options.saturation] - Saturation adjustment
+ * @param {number} [options.brightness] - Brightness adjustment
+ * @param {number} [options.contrast] - Contrast adjustment
+ * @param {number} [options.gamma] - Gamma adjustment
+ * @param {number} [options.rotate] - Rotation angle in degrees
+ * @param {number} [options.dpr] - Device pixel ratio for responsive images
+ * @param {string} [options.background] - Background color (e.g., '#FFFFFF')
+ * @param {number} [options.padding] - Padding to add around the image
+ * @param {boolean} [options.anim] - Whether to preserve animation in GIFs
+ * @param {string} [options.onerror] - Error handling strategy
+ * @param {string} [options.compression] - Compression strategy
+ * @param {string} [options.fetchFormat] - Format to request from origin
+ * @param {string} [options.sampling] - Chroma subsampling strategy
+ * @param {string} [options.metadata] - Metadata to preserve
+ *
+ * @returns {string} The fully constructed image URL with transformations
+ */
+export function buildImageSRC(url, options = {}) {
+  // Process Sanity URL first if applicable
+  if (url.includes('cdn.sanity.io')) {
+    url = applySanityTransformations(url, options)
+  }
+
+  // Then apply Cloudflare transformations
+  return applyCloudflareWrapper(url, options)
+}
+
+/**
+ * Applies Sanity-specific image transformations to a Sanity CDN URL
+ *
+ * @param {string} url - The Sanity CDN URL
+ * @param {Object} options - Image transformation options
+ * @returns {string} URL with Sanity transformations applied
+ * @private
+ */
+export function applySanityTransformations(url, options) {
+  const { width, height, quality } = options
+
+  const sanityOptions = []
+
+  // Dimensions
+  if (width) sanityOptions.push(`w=${width}`)
+  if (height) sanityOptions.push(`h=${height}`)
+  if (quality) sanityOptions.push(`q=${quality}`)
+
+  // Add parameters to Sanity URL
+  const sanityQuery = sanityOptions.length > 0 ? `?${sanityOptions.join('&')}` : ''
+  return `${url}${sanityQuery}`
+}
+
+/**
+ * Wraps a URL with Cloudflare's Image Resizing service and applies transformations
+ *
+ * @param {string} url - The source URL (can be any image URL)
+ * @param {Object} options - Image transformation options
+ * @returns {string} URL with Cloudflare transformations applied
+ * @private
+ */
+export function applyCloudflareWrapper(url, options) {
+  const {
+    width,
+    height,
+    quality,
+    fit,
+    gravity,
+    format,
+    blur,
+    sharpen,
+    brightness,
+    contrast,
+    gamma,
+    rotate,
+    dpr,
+    background,
+    padding,
+    anim,
+    onerror,
+    compression,
+    fetchFormat,
+    sampling,
+    metadata,
+  } = options
+
+  const cloudflareOptions = []
+
+  // Build Cloudflare options - required parameters
+  if (width) cloudflareOptions.push(`width=${width}`)
+  if (height) cloudflareOptions.push(`height=${height}`)
+  if (quality) cloudflareOptions.push(`quality=${quality}`)
+
+  // Add optional Cloudflare parameters
+  if (format) cloudflareOptions.push(`format=${format}`)
+  if (fit) cloudflareOptions.push(`fit=${fit}`)
+  if (gravity) cloudflareOptions.push(`gravity=${gravity}`)
+
+  if (sharpen !== null && sharpen !== undefined) cloudflareOptions.push(`sharpen=${sharpen}`)
+  if (blur !== null && blur !== undefined) cloudflareOptions.push(`blur=${blur}`)
+  if (brightness !== null && brightness !== undefined)
+    cloudflareOptions.push(`brightness=${brightness}`)
+  if (contrast !== null && contrast !== undefined) cloudflareOptions.push(`contrast=${contrast}`)
+  if (gamma !== null && gamma !== undefined) cloudflareOptions.push(`gamma=${gamma}`)
+  if (rotate !== null && rotate !== undefined) cloudflareOptions.push(`rotate=${rotate}`)
+  if (dpr !== null && dpr !== undefined) cloudflareOptions.push(`dpr=${dpr}`)
+
+  if (metadata !== null && metadata !== undefined) cloudflareOptions.push(`metadata=${metadata}`)
+  if (onerror !== null && onerror !== undefined) cloudflareOptions.push(`onerror=${onerror}`)
+  if (anim === false) cloudflareOptions.push('anim=false')
+  if (background !== null && background !== undefined)
+    cloudflareOptions.push(`background=${background}`)
+  if (fetchFormat !== null && fetchFormat !== undefined)
+    cloudflareOptions.push(`fetchFormat=${fetchFormat}`)
+  if (compression !== null && compression !== undefined)
+    cloudflareOptions.push(`compression=${compression}`)
+  if (sampling !== null && sampling !== undefined) cloudflareOptions.push(`sampling=${sampling}`)
+  if (padding !== null && padding !== undefined) cloudflareOptions.push(`padding=${padding}`)
+
+  const optionsString = cloudflareOptions.length > 0 ? cloudflareOptions.join(',') : ''
+
+  return `https://www.musora.com/cdn-cgi/image/${optionsString}/${url}`
+}

package/src/services/imageSRCVerify.js

@@ -0,0 +1,114 @@
+/**
+ * Verifies if an image URL follows best practices for optimization
+ *
+ * This function checks whether:
+ * 1. Sanity CDN images include query parameters for optimization
+ * 2. Direct S3 images are avoided (should use CDN instead)
+ *
+ * @param {string} src - The image source URL to verify
+ * @returns {void}
+ *
+ * @example
+ * // Check a direct Sanity URL
+ * verifyImageSRC('https://cdn.sanity.io/images/4032r8py/staging/504c4e3393170f937a579de6f3c75c457b0c9e65-640x360.jpg');
+ *
+ * @example
+ * // Check a Sanity URL inside a Cloudflare URL
+ * verifyImageSRC('https://www.musora.com/cdn-cgi/image/width=500,quality=95/https://cdn.sanity.io/images/4032r8py/staging/504c4e3393170f937a579de6f3c75c457b0c9e65-640x360.jpg');
+ */
+export function verifyImageSRC(src) {
+  // Exit early if the URL is empty
+  if (!src) return
+
+  // Check for S3 direct URLs
+  if (isBucketUrl(src)) {
+    warnAboutDirectS3Url(src)
+    return
+  }
+
+  // Check for Sanity URLs
+  if (src.includes('cdn.sanity.io')) {
+    verifySanityUrl(src)
+  }
+}
+
+/**
+ * Checks if a URL is a direct link to an S3 bucket
+ *
+ * @param {string} url - The URL to check
+ * @returns {boolean} True if the URL is a direct S3 bucket URL
+ * @private
+ */
+export function isBucketUrl(url) {
+  // Check for common S3 patterns
+  return (
+    url.includes('.s3.amazonaws.com') ||
+    url.includes('s3.us-') ||
+    url.includes('amazonaws.com/') ||
+    (url.includes('musora-') && url.includes('.s3.'))
+  )
+}
+
+/**
+ * Issues a warning about using direct S3 URLs instead of a CDN
+ *
+ * @param {string} url - The S3 URL that triggered the warning
+ * @private
+ */
+function warnAboutDirectS3Url(url) {
+  // Only warn in development mode
+  if (process.env.NODE_ENV !== 'production') {
+    console.warn(`WARNING: Direct S3 bucket URL detected: ${url}
+    This is not recommended. Use Cloudfront or another CDN for better performance.`)
+  }
+}
+
+/**
+ * Extracts a Sanity URL from a potentially Cloudflare-wrapped URL
+ *
+ * @param {string} url - The URL to process
+ * @returns {string} The extracted Sanity URL
+ * @private
+ */
+export function extractSanityUrl(url) {
+  // If this is a Cloudflare URL, extract the Sanity portion
+  if (url.includes('/cdn-cgi/image/')) {
+    // Split the URL to get the portion after /cdn-cgi/image/[parameters]/
+    const parts = url.split('/cdn-cgi/image/')
+    if (parts.length > 1) {
+      // Get everything after the first / that follows the Cloudflare parameters
+      const cfParamsAndSanityUrl = parts[1]
+      const slashIndex = cfParamsAndSanityUrl.indexOf('/', 0)
+      if (slashIndex !== -1) {
+        let sanityUrl = cfParamsAndSanityUrl.substring(slashIndex + 1)
+        return sanityUrl
+      }
+    }
+  }
+
+  // If not a Cloudflare URL or extraction failed, return the original URL
+  return url
+}
+
+/**
+ * Verifies if a Sanity CDN image URL includes optimization parameters
+ *
+ * @param {string} src - The Sanity image URL to verify
+ * @private
+ */
+function verifySanityUrl(src) {
+  // Extract the Sanity URL if it's wrapped in a Cloudflare URL
+  const sanityUrl = extractSanityUrl(src)
+
+  // Check if the Sanity URL has parameters (any query string)
+  const hasParameters = sanityUrl.includes('?')
+
+  // Warn if no parameters are found
+  if (!hasParameters) {
+    // Only warn in development mode
+    if (process.env.NODE_ENV !== 'production') {
+      console.warn(`WARNING: Sanity CDN URL without parameters detected: ${src}
+    This may cause performance issues. Consider adding image transformations using the buildImageSRC MCS service.`)
+    }
+  }
+}

package/src/services/railcontent.js

@@ -222,7 +222,7 @@ export async function fetchCompletedContent(type = 'all', brand, { page, limit }
  *   .catch(error => console.error(error));
  */
 export async function fetchContentPageUserData(contentId) {
-  let url = `/content/${contentId}/user_data/${globalConfig.railcontentConfig.userId}`
+  let url = `/api/content/v1/${contentId}/user_data/${globalConfig.railcontentConfig.userId}`
   const headers = {
     'Content-Type': 'application/json',
     Accept: 'application/json',
@@ -873,8 +873,8 @@ export async function postContentComplete(contentId) {
 }
 
 export async function postContentReset(contentId) {
-  let url = `/content/user/progress/reset`
-  return postDataHandler(url, { contentId: contentId })
+  let url = `/api/content/v1/user/progress/reset/${contentId}`
+  return postDataHandler(url)
 }
 
 /**