Fix dimensions of loading component for compose drawer (#4872)
This commit is contained in:
		
							parent
							
								
									3f333a8d31
								
							
						
					
					
						commit
						f2cbfb2eb3
					
				
					 2 changed files with 15 additions and 3 deletions
				
			
		| 
						 | 
					@ -9,6 +9,7 @@ import { links, getIndex, getLink } from './tabs_bar';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import BundleContainer from '../containers/bundle_container';
 | 
					import BundleContainer from '../containers/bundle_container';
 | 
				
			||||||
import ColumnLoading from './column_loading';
 | 
					import ColumnLoading from './column_loading';
 | 
				
			||||||
 | 
					import DrawerLoading from './drawer_loading';
 | 
				
			||||||
import BundleColumnError from './bundle_column_error';
 | 
					import BundleColumnError from './bundle_column_error';
 | 
				
			||||||
import { Compose, Notifications, HomeTimeline, CommunityTimeline, PublicTimeline, HashtagTimeline, FavouritedStatuses } from '../../ui/util/async-components';
 | 
					import { Compose, Notifications, HomeTimeline, CommunityTimeline, PublicTimeline, HashtagTimeline, FavouritedStatuses } from '../../ui/util/async-components';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -129,8 +130,8 @@ export default class ColumnsArea extends ImmutablePureComponent {
 | 
				
			||||||
    );
 | 
					    );
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  renderLoading = () => {
 | 
					  renderLoading = columnId => () => {
 | 
				
			||||||
    return <ColumnLoading />;
 | 
					    return columnId === 'COMPOSE' ? <DrawerLoading /> : <ColumnLoading />;
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  renderError = (props) => {
 | 
					  renderError = (props) => {
 | 
				
			||||||
| 
						 | 
					@ -158,7 +159,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
 | 
				
			||||||
          const params = column.get('params', null) === null ? null : column.get('params').toJS();
 | 
					          const params = column.get('params', null) === null ? null : column.get('params').toJS();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
          return (
 | 
					          return (
 | 
				
			||||||
            <BundleContainer key={column.get('uuid')} fetchComponent={componentMap[column.get('id')]} loading={this.renderLoading} error={this.renderError}>
 | 
					            <BundleContainer key={column.get('uuid')} fetchComponent={componentMap[column.get('id')]} loading={this.renderLoading(column.get('id'))} error={this.renderError}>
 | 
				
			||||||
              {SpecificComponent => <SpecificComponent columnId={column.get('uuid')} params={params} multiColumn />}
 | 
					              {SpecificComponent => <SpecificComponent columnId={column.get('uuid')} params={params} multiColumn />}
 | 
				
			||||||
            </BundleContainer>
 | 
					            </BundleContainer>
 | 
				
			||||||
          );
 | 
					          );
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -0,0 +1,11 @@
 | 
				
			||||||
 | 
					import React from 'react';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					const DrawerLoading = () => (
 | 
				
			||||||
 | 
					  <div className='drawer'>
 | 
				
			||||||
 | 
					    <div className='drawer__pager'>
 | 
				
			||||||
 | 
					      <div className='drawer__inner' />
 | 
				
			||||||
 | 
					    </div>
 | 
				
			||||||
 | 
					  </div>
 | 
				
			||||||
 | 
					);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export default DrawerLoading;
 | 
				
			||||||
		Loading…
	
	Add table
		
		Reference in a new issue