[Glitch] Rewrite <Skeleton/> as FC and TS
				
					
				
			Port 8066118d1f to glitch-soc
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
			
			
This commit is contained in:
		@@ -9,7 +9,7 @@ import { defineMessages, injectIntl } from 'react-intl';
 | 
			
		||||
import ImmutablePureComponent from 'react-immutable-pure-component';
 | 
			
		||||
import { me } from 'flavours/glitch/initial_state';
 | 
			
		||||
import { RelativeTimestamp } from './relative_timestamp';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
 | 
			
		||||
const messages = defineMessages({
 | 
			
		||||
  follow: { id: 'account.follow', defaultMessage: 'Follow' },
 | 
			
		||||
 
 | 
			
		||||
@@ -4,7 +4,7 @@ import api from 'flavours/glitch/api';
 | 
			
		||||
import { FormattedNumber } from 'react-intl';
 | 
			
		||||
import { Sparklines, SparklinesCurve } from 'react-sparklines';
 | 
			
		||||
import classNames from 'classnames';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
 | 
			
		||||
const percIncrease = (a, b) => {
 | 
			
		||||
  let percent;
 | 
			
		||||
 
 | 
			
		||||
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 | 
			
		||||
import api from 'flavours/glitch/api';
 | 
			
		||||
import { FormattedNumber } from 'react-intl';
 | 
			
		||||
import { roundTo10 } from 'flavours/glitch/utils/numbers';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
 | 
			
		||||
export default class Dimension extends React.PureComponent {
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -8,7 +8,7 @@ import type { Account } from 'flavours/glitch/types/resources';
 | 
			
		||||
 | 
			
		||||
import { autoPlayGif } from '../initial_state';
 | 
			
		||||
 | 
			
		||||
import Skeleton from './skeleton';
 | 
			
		||||
import { Skeleton } from './skeleton';
 | 
			
		||||
 | 
			
		||||
interface Props {
 | 
			
		||||
  account: Account;
 | 
			
		||||
 
 | 
			
		||||
@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 | 
			
		||||
import ImmutablePropTypes from 'react-immutable-proptypes';
 | 
			
		||||
import Permalink from './permalink';
 | 
			
		||||
import ShortNumber from 'flavours/glitch/components/short_number';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import classNames from 'classnames';
 | 
			
		||||
 | 
			
		||||
class SilentErrorBoundary extends React.Component {
 | 
			
		||||
 
 | 
			
		||||
@@ -4,7 +4,7 @@ import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
 | 
			
		||||
import { connect } from 'react-redux';
 | 
			
		||||
import { fetchServer } from 'flavours/glitch/actions/server';
 | 
			
		||||
import ShortNumber from 'flavours/glitch/components/short_number';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import Account from 'flavours/glitch/containers/account_container';
 | 
			
		||||
import { domain } from 'flavours/glitch/initial_state';
 | 
			
		||||
import { ServerHeroImage } from 'flavours/glitch/components/server_hero_image';
 | 
			
		||||
 
 | 
			
		||||
@@ -1,11 +0,0 @@
 | 
			
		||||
import React from 'react';
 | 
			
		||||
import PropTypes from 'prop-types';
 | 
			
		||||
 | 
			
		||||
const Skeleton = ({ width, height }) => <span className='skeleton' style={{ width, height }}>‌</span>;
 | 
			
		||||
 | 
			
		||||
Skeleton.propTypes = {
 | 
			
		||||
  width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 | 
			
		||||
  height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
export default Skeleton;
 | 
			
		||||
							
								
								
									
										12
									
								
								app/javascript/flavours/glitch/components/skeleton.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								app/javascript/flavours/glitch/components/skeleton.tsx
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,12 @@
 | 
			
		||||
import React from 'react';
 | 
			
		||||
 | 
			
		||||
interface Props {
 | 
			
		||||
  width?: number | string;
 | 
			
		||||
  height?: number | string;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export const Skeleton: React.FC<Props> = ({ width, height }) => (
 | 
			
		||||
  <span className='skeleton' style={{ width, height }}>
 | 
			
		||||
    ‌
 | 
			
		||||
  </span>
 | 
			
		||||
);
 | 
			
		||||
@@ -8,7 +8,7 @@ import LinkFooter from 'flavours/glitch/features/ui/components/link_footer';
 | 
			
		||||
import { Helmet } from 'react-helmet';
 | 
			
		||||
import { fetchServer, fetchExtendedDescription, fetchDomainBlocks } from 'flavours/glitch/actions/server';
 | 
			
		||||
import Account from 'flavours/glitch/containers/account_container';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Icon } from 'flavours/glitch/components/icon';
 | 
			
		||||
import classNames from 'classnames';
 | 
			
		||||
import { ServerHeroImage } from 'flavours/glitch/components/server_hero_image';
 | 
			
		||||
 
 | 
			
		||||
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 | 
			
		||||
import { Blurhash } from 'flavours/glitch/components/blurhash';
 | 
			
		||||
import { accountsCountRenderer } from 'flavours/glitch/components/hashtag';
 | 
			
		||||
import ShortNumber from 'flavours/glitch/components/short_number';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import classNames from 'classnames';
 | 
			
		||||
 | 
			
		||||
export default class Story extends React.PureComponent {
 | 
			
		||||
 
 | 
			
		||||
@@ -4,7 +4,7 @@ import { Helmet } from 'react-helmet';
 | 
			
		||||
import { FormattedMessage, FormattedDate, injectIntl, defineMessages } from 'react-intl';
 | 
			
		||||
import Column from 'flavours/glitch/components/column';
 | 
			
		||||
import api from 'flavours/glitch/api';
 | 
			
		||||
import Skeleton from 'flavours/glitch/components/skeleton';
 | 
			
		||||
import { Skeleton } from 'flavours/glitch/components/skeleton';
 | 
			
		||||
 | 
			
		||||
const messages = defineMessages({
 | 
			
		||||
  title: { id: 'privacy_policy.title', defaultMessage: 'Privacy Policy' },
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user