:sparkles: Functionalities

:heavy_check_mark: Convert Date to TimeAgo; :heavy_check_mark: Until now support the following languages 'pt-BR', 'en-US';

:star: Example

Example 01

import { View } from 'react-native';
import TimeAgo from 'view-timeago';

const App = () => {
  const date = new Date();
  return (
    <View>
      <TimeAgo date={date} language="pt-BR" />
      //By default it updates every 1 minute
    </View>
  )
}

Example 02

import { View } from 'react-native';
import TimeAgo from 'view-timeago';

const App = () => {
  const date = new Date();
  return (
    <View>
      <TimeAgo date={date} interval={1000} language="pt-BR" style={{fontSize: 20}} />
      //Updates every 1 second
    </View>
  )
}

Example 03 Styled-Components

//styled.ts
import styled from 'styled-components/native';
import TimeAgo from 'view-timeago';

export const TimeAgoText = styled(TimeAgo)`
  font-size: 20px;
`;

// App.tsx
import { View } from 'react-native';
import { TimeAgoText } from './styles';

const App = () => {
  const date = new Date();
  return (
    <View>
      <TimeAgoText date={date} interval={1000} language="pt-BR" style={{fontSize: 20}} />
      //Updates every 1 second
    </View>
  )
}

Example 01 Web

import TimeAgo from 'view-timeago/web';

const App = () => {
  const date = new Date();
  return (
    <div>
      <TimeAgo date={date} language="pt-BR" />
      //By default it updates every 1 minute
    </div>
  )
}

Example 02 Web

import TimeAgo from 'view-timeago/web';

const App = () => {
  const date = new Date();
  return (
    <div>
      <TimeAgo date={date} interval={1000} language="pt-BR" style={{fontSize: 20}} />
      //Updates every 1 second
    </div>
  )
}

Example 03 Styled-Components Web

//styled.ts
import styled from 'styled-components';
import TimeAgo from 'view-timeago/web';

export const TimeAgoText = styled(TimeAgo)`
  font-size: 20px;
`;

// App.tsx
import { TimeAgoText } from './styles';

const App = () => {
  const date = new Date();
  return (
    <div>
      <TimeAgoText date={date} interval={1000} language="pt-BR" style={{fontSize: 20}} />
      //Updates every 1 second
    </div>
  )
}

:rocket: Tecnologias

The following tools were used in the construction of the project:

• Node.js
• React Native
• TypeScript

:memo: Licença

This project is under MIT license. See the archive LICENSE for more details.

Done with :heart: per Mateus Conceição

Back to the top