@times-components/ts-components 1.98.2-alpha.8 → 1.98.2

package/src/components/update-button/update-button-with-delay.tsx

@@ -1,54 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import { DelayedComponent } from '../delayed-component/delayed-component';
-import { UpdateButton } from './update-button';
-import fetch from 'isomorphic-unfetch';
-
-type UpdateWithDelayProps = {
-  display: boolean;
-  delay: number;
-  label: string;
-  handleClick: () => void;
-  updatedTime: string;
-  articleId: string;
-  update: boolean;
-};
-
-export const fetchData = async (articleId: string) => {
-  try {
-    const response = await fetch(`/api/article-update-time/${articleId}`);
-    const json = await response.json();
-    return json.article.publishedTime;
-  } catch (err) {
-    // tslint:disable-next-line:no-console
-    console.log(err);
-  }
-};
-
-export const UpdateButtonWithDelay = ({
-  delay,
-  display,
-  label,
-  handleClick,
-  updatedTime,
-  articleId,
-  update = false
-}: UpdateWithDelayProps) => {
-  const [hasUpdate, setUpdate] = useState(update);
-  useEffect(() => {
-    const interval = setInterval(async () => {
-      (await fetchData(articleId)) > updatedTime && setUpdate(true);
-    }, 120000);
-
-    return () => clearInterval(interval);
-  }, []);
-
-  return (
-    <>
-      {hasUpdate ? (
-        <DelayedComponent delay={delay} initialState={display}>
-          <UpdateButton label={label} handleClick={handleClick} />
-        </DelayedComponent>
-      ) : null}
-    </>
-  );
-};

package/src/components/update-button/update-button.stories.mdx

@@ -1,32 +0,0 @@
-import { Meta, Story, Props } from '@storybook/addon-docs'
-
-import { UpdateButton } from './update-button.tsx';
-
-<Meta
-  title="Components/Misc/UpdateButton"
-  component={UpdateButton}
-/>
-
-# UpdateButton component
-The `UpdateButton` component is used to highlight when there is an update.
-
-This component takes in a two props, loading to display the loading spinner, arrowUp - determines the position of the arrow Icon, label - which determines the text content of the button, and handleClick which is the function called upon clicking the button. 
-
-## Props
-<Props of={UpdateButton} />
-
-## Code Example
-`<UpdateButton loading={loading} label='New updates', arrowUp={true}/>`
-
-## View Component
-Please click the 'Canvas' tab for a better viewing experience, where you can update the props and review at the different breakpoints by clicking the preview icon and selecting from our list of pre-defined breakpoints (XS, SM, MD, LG and XL).
-
-export const UpdateButtonStory = ({ loading, label, arrowUp }) => (
-    <UpdateButton loading={loading} label={label} arrowUp={arrowUp} />
-);
-
-<Story name="UpdateButton"
-  args={{ loading: false, label: 'New Updates', arrowUp: true} }
->
-  {UpdateButtonStory.bind({})}
-</Story>

package/src/components/update-button/update-button.tsx

@@ -1,17 +0,0 @@
-import React from 'react';
-import { FilledArrowIcon } from '../../assets';
-import { StyledButton } from './styles';
-
-type UpdateButtonProps = {
-  label: string;
-  handleClick: () => void;
-};
-
-export const UpdateButton = ({ label, handleClick }: UpdateButtonProps) => {
-  return (
-    <StyledButton onClick={() => handleClick()}>
-      <FilledArrowIcon data-testid="upward-arrow" />
-      {label}
-    </StyledButton>
-  );
-};

package/src/fixtures/article-harness/__tests__/__snapshots__/articleHarness.test.tsx.snap

@@ -1,34 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Render ArticleHarness renders the ArticleHarness 1`] = `
-<DocumentFragment>
-  <div
-    class="sc-bdVaJa glDQbs"
-  >
-    <div
-      class="sc-bwzfXH fBhOFq"
-    >
-      <div
-        class="sc-htpNat sc-bxivhb gakSZq"
-      >
-        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec eleifend quis purus eget consequat. Maecenas pellentesque lorem at ipsum egestas sagittis. Quisque eget nisi sed diam auctor luctus. Pellentesque rutrum sem nibh, at placerat elit iaculis in. Curabitur nec turpis nec nisi pulvinar pharetra.
-      </div>
-      <div
-        class="sc-htpNat sc-bxivhb gakSZq"
-      >
-        Aenean hendrerit erat non augue sagittis rhoncus. Praesent diam lacus, vehicula ut ante et, cursus finibus justo. Curabitur sollicitudin turpis nec diam ullamcorper, sed fermentum diam tempor. Integer maximus ultrices sem, eu facilisis magna condimentum ut. Curabitur orci odio, ornare in ipsum quis, cursus scelerisque sem.
-      </div>
-      <div
-        class="sc-htpNat sc-bxivhb gakSZq"
-      >
-        Maecenas ultricies risus at libero vulputate, non accumsan ex iaculis. In vel facilisis sapien. Nam imperdiet, elit a mattis consectetur, ex purus efficitur eros, nec condimentum mi tortor facilisis orci. Donec sodales felis tortor, ut dignissim turpis rhoncus ut. Quisque lacinia ornare tortor at convallis.
-      </div>
-      <div
-        class="sc-htpNat sc-bxivhb gakSZq"
-      >
-        Praesent ac elit quis metus vulputate facilisis. Quisque ac dolor eu felis pharetra dignissim. Sed tristique egestas sollicitudin. Nulla varius, risus ornare tristique lobortis, est libero vestibulum diam, nec mollis turpis ligula eget nibh. Praesent facilisis sem lectus, et consectetur sem fringilla non. Pellentesque condimentum est sed nisl porttitor ultricies.
-      </div>
-    </div>
-  </div>
-</DocumentFragment>
-`;

package/src/fixtures/article-harness/__tests__/articleHarness.test.tsx

@@ -1,11 +0,0 @@
-import React from 'react';
-import '@testing-library/jest-dom';
-import { render } from '@testing-library/react';
-import { ArticleHarness } from '../ArticleHarness';
-
-describe('Render ArticleHarness', () => {
-  it('renders the ArticleHarness', () => {
-    const { asFragment } = render(<ArticleHarness />);
-    expect(asFragment()).toMatchSnapshot();
-  });
-});