react-datocms 4.1.3 → 4.2.0

package/src/VideoPlayer/index.tsx

@@ -0,0 +1,107 @@
+'use client';
+
+// This file defines a React component that easily displays a video player using
+// data stored on DatoCMS and retrieved via DatoCMS GraphQL API. The component
+// is a thin wrapper around the [React component made available by MUX][1].
+//
+// The React player written by MUX is an adapter for a web component.
+//
+// [1]: https://www.mux.com/player
+
+import React, { forwardRef } from 'react';
+
+// We use and extend Typescript types defined in the MUX player.
+
+import type MuxPlayerElement from '@mux/mux-player';
+import { type MuxPlayerProps } from '@mux/mux-player-react/.';
+
+// React MUX player is made available in two flavours: eager and lazy loaded. We
+// choose to use the lazy version to avoid loading the web component uselessly.
+// MUX player lazy version loads internally the eager version using
+// `React.lazy()`.
+
+import MuxPlayer from '@mux/mux-player-react/lazy';
+
+// The core of this component is the `useVideoPlayer` hook: it takes
+// data from DatoCMS GraphQL API and returns props as expected by the
+// `<MuxPlayer />` component.
+
+import { useVideoPlayer } from '../useVideoPlayer/index.js';
+
+type Maybe<T> = T | null;
+type Possibly<T> = Maybe<T> | undefined;
+
+// `Video` represents a fragment of data regarding a video as returned from
+// DatoCMS GraphQL API.
+
+export type Video = {
+  /** Title attribute (`title`) for the video */
+  title?: Possibly<string>;
+  /** The height of the video */
+  height?: Possibly<number>;
+  /** The width of the video */
+  width?: Possibly<number>;
+  /** The MUX playbaack ID */
+  muxPlaybackId?: Possibly<string>;
+  /** The MUX playbaack ID */
+  playbackId?: Possibly<string>;
+  /** A data: URI containing a blurhash for the video  */
+  blurUpThumb?: Possibly<string>;
+  /** Other data can be passed, but they have no effect on rendering the player */
+  // biome-ignore lint/suspicious/noExplicitAny: we intentionally want to allow to add any other value to this video object
+  [k: string]: any;
+};
+
+// The component supports [all the props][1] allowed by the `<MuxPlayer />`
+// component, plus the `data` prop, explicitly meant to pass data in the shape
+// returned from the DatoCMS API.
+//
+// [1]: https://github.com/muxinc/elements/blob/main/packages/mux-player-react/REFERENCE.md
+
+export type VideoPlayerProps = MuxPlayerProps & {
+  /** The actual response you get from a DatoCMS `video` GraphQL query */
+  data?: Video;
+};
+
+export const VideoPlayer: (
+  props: VideoPlayerProps,
+) => ReturnType<typeof MuxPlayer> = forwardRef<
+  MuxPlayerElement,
+  VideoPlayerProps
+>((props, ref) => {
+  const {
+    data = {},
+    disableCookies = true,
+    preload = "metadata",
+    style: styleFromProps,
+    ...rest
+  } = props;
+
+  const {
+    title,
+    playbackId,
+    style: styleFromHook,
+    placeholder,
+  } = useVideoPlayer({
+    data,
+  });
+
+  const style = {
+    ...styleFromHook,
+    ...styleFromProps,
+  };
+
+  return (
+    <MuxPlayer
+      ref={ref}
+      streamType="on-demand"
+      preload={preload}
+      title={title}
+      disableCookies={disableCookies}
+      playbackId={playbackId}
+      style={style}
+      placeholder={placeholder}
+      {...rest}
+    />
+  );
+});

package/src/{setupTests.ts → __tests__/setup.ts}

@@ -1,5 +1,8 @@
-import { configure } from 'enzyme';
 import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
+import { configure } from 'enzyme';
+import ResizeObserver from 'resize-observer-polyfill';
+
+global.ResizeObserver = ResizeObserver;
 
 configure({
   adapter: new Adapter(),

package/src/index.ts

@@ -1,5 +1,8 @@
 export * from './Image/index.js';
 export * from './Seo/index.js';
-export * from './useQuerySubscription/index.js';
+export * from './VideoPlayer/index.js';
 export * from './StructuredText/index.js';
+
+export * from './useQuerySubscription/index.js';
 export * from './useSiteSearch/index.js';
+export * from './useVideoPlayer/index.js';

package/src/useQuerySubscription/index.ts

@@ -1,16 +1,14 @@
 'use client';
 
-import { useState } from 'react';
 import {
-  subscribeToQuery,
-  UnsubscribeFn,
   ChannelErrorData,
   ConnectionStatus,
   Options,
+  UnsubscribeFn,
+  subscribeToQuery,
 } from 'datocms-listen';
-import {
-  useDeepCompareEffectNoCheck as useDeepCompareEffect,
-} from 'use-deep-compare-effect';
+import { useState } from 'react';
+import { useDeepCompareEffectNoCheck as useDeepCompareEffect } from 'use-deep-compare-effect';
 
 export type SubscribeToQueryOptions<QueryResult, QueryVariables> = Omit<
   Options<QueryResult, QueryVariables>,
@@ -36,7 +34,9 @@ export type QueryListenerOptions<QueryResult, QueryVariables> =
   | DisabledQueryListenerOptions<QueryResult, QueryVariables>;
 
 export function useQuerySubscription<
+  // biome-ignore lint/suspicious/noExplicitAny: <explanation>
   QueryResult = any,
+  // biome-ignore lint/suspicious/noExplicitAny: <explanation>
   QueryVariables = Record<string, any>,
 >(options: QueryListenerOptions<QueryResult, QueryVariables>) {
   const { enabled, initialData, ...other } = options;

package/src/useVideoPlayer/__tests__/index.test.tsx

@@ -0,0 +1,98 @@
+import { useVideoPlayer } from '..';
+
+describe('useVideoPlayer', () => {
+  describe('when data object', () => {
+    describe('is complete', () => {
+      const data = {
+        muxPlaybackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+        title: 'Title',
+        width: 1080,
+        height: 1920,
+        blurUpThumb:
+          'data:image/bmp;base64,Qk0eAAAAAAAAABoAAAAMAAAAAQABAAEAGAAAAP8A',
+      };
+
+      it('unwraps data into props ready for MUX player', () => {
+        expect(useVideoPlayer({ data })).toStrictEqual({
+          playbackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+          title: 'Title',
+          style: {
+            aspectRatio: '1080 / 1920',
+          },
+          placeholder:
+            'data:image/bmp;base64,Qk0eAAAAAAAAABoAAAAMAAAAAQABAAEAGAAAAP8A',
+        });
+      });
+    });
+
+    describe('contains `muxPlaybackId`', () => {
+      const data = {
+        muxPlaybackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+      };
+
+      it('uses it for `playbackId`', () => {
+        expect(useVideoPlayer({ data })).toStrictEqual({
+          playbackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+        });
+      });
+    });
+
+    describe('contains `playbackId`', () => {
+      const data = {
+        playbackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+      };
+
+      it('uses it for `playbackId`', () => {
+        expect(useVideoPlayer({ data })).toStrictEqual({
+          playbackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+        });
+      });
+    });
+
+    describe('lacks of `width` and `height` values', () => {
+      const data = {
+        muxPlaybackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+        title: 'Title',
+      };
+
+      it('avoids adding aspect ratio', () => {
+        expect(useVideoPlayer({ data })).toStrictEqual({
+          playbackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+          title: 'Title',
+        });
+      });
+    });
+
+    describe('lacks of `title` value', () => {
+      const data = {
+        muxPlaybackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+        width: 1080,
+        height: 1920,
+      };
+
+      it('avoids adding a title', () => {
+        expect(useVideoPlayer({ data })).toStrictEqual({
+          playbackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+          style: {
+            aspectRatio: '1080 / 1920',
+          },
+        });
+      });
+    });
+
+    describe('has other keys', () => {
+      const data = {
+        muxPlaybackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+        title: 'Title',
+        something: 'Else',
+      };
+
+      it('ignores them', () => {
+        expect(useVideoPlayer({ data })).toStrictEqual({
+          playbackId: 'ip028MAXF026dU900bKiyNDttjonw7A1dFY',
+          title: 'Title',
+        });
+      });
+    });
+  });
+});

package/src/useVideoPlayer/index.ts

@@ -0,0 +1,68 @@
+import { MuxPlayerProps } from '@mux/mux-player-react/.';
+
+import { Video } from '../VideoPlayer';
+
+type Maybe<T> = T | null;
+type Possibly<T> = Maybe<T> | undefined;
+
+const computedTitle = (title: Maybe<string> | undefined) => {
+  return title ? { title } : undefined;
+};
+
+const computedPlaybackId = (
+  muxPlaybackId: Possibly<string>,
+  playbackId: Possibly<string>,
+) => {
+  if (!(muxPlaybackId || playbackId)) return undefined;
+
+  return { playbackId: `${muxPlaybackId || playbackId}` };
+};
+
+const computedStyle = (
+  width: Possibly<number>,
+  height: Possibly<number>,
+) => {
+  if (!(width && height)) return undefined;
+
+  return {
+    style: {
+      aspectRatio: `${width} / ${height}`,
+    },
+  };
+};
+
+const computedPlaceholder = (blurUpThumb: Possibly<string>) => {
+  return blurUpThumb ? { placeholder: blurUpThumb } : undefined;
+};
+
+type Style = MuxPlayerProps['style'];
+type Title = MuxPlayerProps['title'];
+type PlaybackId = MuxPlayerProps['playbackId'];
+type Placeholder = MuxPlayerProps['placeholder'];
+
+type PropsForMuxPlayer = {
+  style?: Style;
+  title?: Title;
+  playbackId?: PlaybackId;
+  placeholder?: Placeholder;
+};
+
+type UseVideoPlayerArgs = {
+  data: Video;
+};
+
+export const useVideoPlayer = ({
+  data,
+}: UseVideoPlayerArgs): PropsForMuxPlayer => {
+  const { title, width, height, playbackId, muxPlaybackId, blurUpThumb } =
+    data || {};
+
+  if (data === undefined) return {};
+
+  return {
+    ...(computedTitle(title) || {}),
+    ...(computedPlaybackId(muxPlaybackId, playbackId) || {}),
+    ...(computedStyle(width, height) || {}),
+    ...(computedPlaceholder(blurUpThumb) || {}),
+  };
+};

package/dist/cjs/Image/__tests__/index.test.js

@@ -1,99 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-exports.__esModule = true;
-var React = __importStar(require("react"));
-var enzyme_1 = require("enzyme");
-require("intersection-observer");
-var index_js_1 = require("../index.js");
-var test_utils_1 = require("react-intersection-observer/test-utils");
-var data = {
-    alt: 'DatoCMS swag',
-    aspectRatio: 1.7777777777777777,
-    base64: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoHBwgHBgoICAgLFQoLDhgQDg0NDh0eHREYIx8lJCIrHB0dLSs7GikyKSEuKjUlKDk1MjIyHyo4PTc+PDcxPjUBCgsLDg0OHBAQHDsoIig7Ozs7Ozs7OzsvOzs7Ozs7Ozs7Lzs7Ozs7Ozs7OzsvOzs7NTsvLy87NTU1Ly8vLzsvL//AABEIAA0AGAMBIgACEQEDEQH/xAAYAAACAwAAAAAAAAAAAAAAAAAGBwABBP/EACEQAAEEAAYDAAAAAAAAAAAAAAEAAgMEBQYHESEiFWFx/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwL/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIRITH/2gAMAwEAAhEDEQA/AFxLgDWTsAd1J5TGy7hEYqNAaNgECX7sjLMQAHJTEy1Zcarfia4lJMauAxqBhLY6ZlaOzDurWvUOd3jZPfCiEh4xs//Z',
-    height: 421,
-    sizes: '(max-width: 750px) 100vw, 750px',
-    src: 'https://www.datocms-assets.com/205/image.png?ar=16%3A9&fit=crop&w=750',
-    srcSet: 'https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=0.25&fit=crop&w=750 187w,↵https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=0.5&fit=crop&w=750 375w,↵https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=0.75&fit=crop&w=750 562w,↵https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=1&fit=crop&w=750 750w,↵https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=1.5&fit=crop&w=750 1125w,↵https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=2&fit=crop&w=750 1500w,↵https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=3&fit=crop&w=750 2250w,↵https://www.datocms-assets.com/205/image.png?ar=16%3A9&dpr=4&fit=crop&w=750 3000w',
-    title: 'These are awesome, we know that.',
-    width: 750
-};
-var minimalData = {
-    base64: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoHBwgHBgoICAgLFQoLDhgQDg0NDh0eHREYIx8lJCIrHB0dLSs7GikyKSEuKjUlKDk1MjIyHyo4PTc+PDcxPjUBCgsLDg0OHBAQHDsoIig7Ozs7Ozs7OzsvOzs7Ozs7Ozs7Lzs7Ozs7Ozs7OzsvOzs7NTsvLy87NTU1Ly8vLzsvL//AABEIAA0AGAMBIgACEQEDEQH/xAAYAAACAwAAAAAAAAAAAAAAAAAGBwABBP/EACEQAAEEAAYDAAAAAAAAAAAAAAEAAgMEBQYHESEiFWFx/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwL/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIRITH/2gAMAwEAAhEDEQA/AFxLgDWTsAd1J5TGy7hEYqNAaNgECX7sjLMQAHJTEy1Zcarfia4lJMauAxqBhLY6ZlaOzDurWvUOd3jZPfCiEh4xs//Z',
-    height: 421,
-    src: 'https://www.datocms-assets.com/205/image.png?ar=16%3A9&fit=crop&w=750',
-    width: 750
-};
-var minimalDataWithRelativeUrl = {
-    base64: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAoHBwgHBgoICAgLFQoLDhgQDg0NDh0eHREYIx8lJCIrHB0dLSs7GikyKSEuKjUlKDk1MjIyHyo4PTc+PDcxPjUBCgsLDg0OHBAQHDsoIig7Ozs7Ozs7OzsvOzs7Ozs7Ozs7Lzs7Ozs7Ozs7OzsvOzs7NTsvLy87NTU1Ly8vLzsvL//AABEIAA0AGAMBIgACEQEDEQH/xAAYAAACAwAAAAAAAAAAAAAAAAAGBwABBP/EACEQAAEEAAYDAAAAAAAAAAAAAAEAAgMEBQYHESEiFWFx/8QAFQEBAQAAAAAAAAAAAAAAAAAAAwL/xAAZEQADAAMAAAAAAAAAAAAAAAAAAQIRITH/2gAMAwEAAhEDEQA/AFxLgDWTsAd1J5TGy7hEYqNAaNgECX7sjLMQAHJTEy1Zcarfia4lJMauAxqBhLY6ZlaOzDurWvUOd3jZPfCiEh4xs//Z',
-    height: 421,
-    src: '/205/image.png?ar=16%3A9&fit=crop&w=750',
-    width: 750
-};
-describe('Image', function () {
-    // intersectionThreshold is an hack to make tests work
-    // we need the library to generate a different IntersectionObserver for each test
-    // otherwise the IntersectionObserver mocking won't work
-    ['intrinsic', 'fixed', 'responsive', 'fill'].forEach(function (layout) {
-        describe("layout=".concat(layout), function () {
-            describe('not visible', function () {
-                it('renders the blur-up thumb', function () {
-                    var wrapper = (0, enzyme_1.mount)(React.createElement(index_js_1.Image, { data: data, layout: layout, intersectionThreshold: 0.1 }));
-                    expect(wrapper).toMatchSnapshot();
-                });
-            });
-            describe('visible', function () {
-                it('renders the image', function () {
-                    var wrapper = (0, enzyme_1.mount)(React.createElement(index_js_1.Image, { data: data, layout: layout, intersectionThreshold: 0.2 }));
-                    (0, test_utils_1.mockAllIsIntersecting)(true);
-                    wrapper.update();
-                    expect(wrapper).toMatchSnapshot();
-                });
-                it('renders the image (minimal data)', function () {
-                    var wrapper = (0, enzyme_1.mount)(React.createElement(index_js_1.Image, { data: minimalData, layout: layout, intersectionThreshold: 0.2 }));
-                    (0, test_utils_1.mockAllIsIntersecting)(true);
-                    wrapper.update();
-                    expect(wrapper).toMatchSnapshot();
-                });
-                it('renders the image (relative URL)', function () {
-                    var wrapper = (0, enzyme_1.mount)(React.createElement(index_js_1.Image, { data: minimalDataWithRelativeUrl, layout: layout, intersectionThreshold: 0.2 }));
-                    (0, test_utils_1.mockAllIsIntersecting)(true);
-                    wrapper.update();
-                    expect(wrapper).toMatchSnapshot();
-                });
-                describe('image loaded', function () {
-                    it('shows the image', function () {
-                        var wrapper = (0, enzyme_1.mount)(React.createElement(index_js_1.Image, { data: data, layout: layout, intersectionThreshold: 0.3 }));
-                        (0, test_utils_1.mockAllIsIntersecting)(true);
-                        wrapper.update();
-                        wrapper.find('img').last().simulate('load');
-                        wrapper.update();
-                        expect(wrapper).toMatchSnapshot();
-                    });
-                });
-            });
-        });
-    });
-});
-//# sourceMappingURL=index.test.js.map

package/dist/cjs/Image/__tests__/index.test.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.test.js","sourceRoot":"","sources":["../../../../src/Image/__tests__/index.test.tsx"],"names":[],"mappings":"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"}