How to use @times-components/utils - 10 common examples

render() {
    const { uri, style, aspectRatio } = this.props;
    const { isLoaded } = this.state;
    // web handles missing protocols just fine, native doesn't. This evens out support.
    const cleanUri = addMissingProtocol(uri);
    const previewUri =
      !cleanUri || this.state.isHighResolutionLoaded
        ? null
        : `${cleanUri}&preview=true`; // TODO: Implement a separate uri for preview

    const props = {
      style: styles.imageBackground,
      onLoad: this.handleLoad
    };

    if (cleanUri) {
      props.source = { uri: cleanUri };
    }

    const previewProps = {
      ...props,

it("sends multiple events", async () => {
        setup();

        const e1 = { component: "Page1" };
        const e2 = { component: "Page2" };

        sendScheduler.enqueue(e1);
        sendScheduler.enqueue(e2);

        await delayAndAdvance(1000);
        expect(global.window.tealiumTrack).toHaveBeenCalledTimes(2);
      });

it("sends more events if they cannot be sent in time", async () => {
        setup();
        const timer = delay(2 * 60 * 1000);

        const e1 = { component: "Page1" };
        const e2 = { component: "Page2" };

        global.window.tealiumTrack = () => {
          advance(1 * 60 * 1000);
        };

        jest.spyOn(global.window, "tealiumTrack");

        sendScheduler.enqueue(e1);
        sendScheduler.enqueue(e2);

        await delayAndAdvance(0);
        await timer;
        expect(global.window.tealiumTrack).toHaveBeenCalledTimes(2);

test: async () => {
        const testInstance = TestRenderer.create(
          
            
          
        );

        await delay(1500);

        expect(testInstance).toMatchSnapshot();
      }
    },

test: async () => {
        const testInstance = TestRenderer.create(
          
            
          
        );

        await delay(1500);

        expect(testInstance).toMatchSnapshot();
      }
    },

setup();
        const timer = delay(2 * 60 * 1000);

        const e1 = { component: "Page1" };
        const e2 = { component: "Page2" };

        global.window.tealiumTrack = () => {
          advance(1 * 60 * 1000);
        };

        jest.spyOn(global.window, "tealiumTrack");

        sendScheduler.enqueue(e1);
        sendScheduler.enqueue(e2);

        await delayAndAdvance(0);
        await timer;
        expect(global.window.tealiumTrack).toHaveBeenCalledTimes(2);
      });
    });

test: () => {
      getDimensions.mockImplementation(() => ({
        width: editionBreakpointWidths[type]
      }));
      const output = TestRenderer.create(
        
           {}} slice={mock} />
        
      );

      expect(output).toMatchSnapshot();
    }
  }));

global.window.tealiumTrack = () => {
          advance(1 * 60 * 1000);
        };

const ArticleLeadAssetVideo = ({
  brightcoveVideoId,
  brightcovePolicyKey,
  brightcoveAccountId,
  posterImage,
  onVideoPress,
  skySports
}) => {
  const crop = getStandardTemplateCrop(posterImage);
  const { ratio, url } = crop;
  const [ratioWidth, ratioHeight] = ratio.split(":");
  const aspectRatio = ratioWidth / ratioHeight;

  const width = screenWidth();
  const height = width / aspectRatio;

  return (
    <video width="{width}" poster="{{" height="{height}">
  );
};
</video>

const ArticleLeadAssetImage = ({
  caption,
  credits,
  crop11,
  crop23,
  crop32,
  crop45,
  crop169,
  crop1251,
  width
}) => {
  const crop = getStandardTemplateCrop({
    crop11,
    crop23,
    crop32,
    crop45,
    crop169,
    crop1251
  });

  if (crop === null) {
    return null;
  }

  const { ratio, url } = crop;
  const [ratioWidth, ratioHeight] = ratio.split(":");
  const aspectRatio = ratioWidth / ratioHeight;