React Europe Workshop Files

formatCustomDateString.js

import moment from 'moment';
import parseCustomDateString from './parseCustomDateString';

export default function formatCustomDateString(weirdDate) {
  let result = weirdDate;
  if (typeof weirdDate === 'string') {
    result = parseCustomDateString(weirdDate);
  }

  return moment(result).format('h:mm A');
}

GrowingTextInput.js

import React from 'react';
import { TextInput, View } from 'react-native';

// Try it: https://snack.expo.io/ByW4CFPx-
export default class GrowingTextInput extends React.Component {
  static defaultProps = {
    minHeight: 30,
  };

  constructor(props, context) {
    super(props, context);

    this.state = {
      height: props.minHeight,
    };
  }

  focus() {
    this._ref.focus();
  }

  blur() {
    this._ref.blur();
  }

  clear() {
    this._ref.clear();
  }

  measure(callback) {
    this._ref.measure(callback);
  }

  setNativeProps(props) {
    this._ref.setNativeProps(props);
  }

  render() {
    return (
      <TextInput
        ref={c => {
          this._ref = c;
        }}
        multiline
        underlineColorAndroid="rgba(0, 0, 0, 0)"
        onContentSizeChange={this._onChangeContentSize}
        {...this.props}
        onChange={event => {
          this._onChangeContentSize(event);
          this.props.onChange && this.props.onChange(event);
        }}
        style={[
          this.props.style,
          { height: Math.max(this.props.minHeight, this.state.height) },
        ]}
      />
    );
  }

  _onChangeContentSize = e => {
    this.setState({ height: e.nativeEvent.contentSize.height });
  };
}

parseCustomDateString.js

export default function parseCustomDateString(weirdDate) {
  let [date, time, offset, utc] = weirdDate.split(' ');
  let isoDate = `${date}T${time}+${offset[1] + '' + offset[2]}:${offset[3] + '' + offset[4]}`;
  return new Date(isoDate);
}