[Glitch] Rewrite RadioButton component as FC
Port 76264e3fe8 to glitch-soc
Signed-off-by: Claire <claire.github-309c@sitedethib.com>
			
			
This commit is contained in:
		@@ -1,35 +0,0 @@
 | 
				
			|||||||
import React from 'react';
 | 
					 | 
				
			||||||
import PropTypes from 'prop-types';
 | 
					 | 
				
			||||||
import classNames from 'classnames';
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
export default class RadioButton extends React.PureComponent {
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  static propTypes = {
 | 
					 | 
				
			||||||
    value: PropTypes.string.isRequired,
 | 
					 | 
				
			||||||
    checked: PropTypes.bool,
 | 
					 | 
				
			||||||
    name: PropTypes.string.isRequired,
 | 
					 | 
				
			||||||
    onChange: PropTypes.func.isRequired,
 | 
					 | 
				
			||||||
    label: PropTypes.node.isRequired,
 | 
					 | 
				
			||||||
  };
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
  render () {
 | 
					 | 
				
			||||||
    const { name, value, checked, onChange, label } = this.props;
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
    return (
 | 
					 | 
				
			||||||
      <label className='radio-button'>
 | 
					 | 
				
			||||||
        <input
 | 
					 | 
				
			||||||
          name={name}
 | 
					 | 
				
			||||||
          type='radio'
 | 
					 | 
				
			||||||
          value={value}
 | 
					 | 
				
			||||||
          checked={checked}
 | 
					 | 
				
			||||||
          onChange={onChange}
 | 
					 | 
				
			||||||
        />
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        <span className={classNames('radio-button__input', { checked })} />
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
        <span>{label}</span>
 | 
					 | 
				
			||||||
      </label>
 | 
					 | 
				
			||||||
    );
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
 | 
					 | 
				
			||||||
}
 | 
					 | 
				
			||||||
							
								
								
									
										30
									
								
								app/javascript/flavours/glitch/components/radio_button.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										30
									
								
								app/javascript/flavours/glitch/components/radio_button.tsx
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,30 @@
 | 
				
			|||||||
 | 
					import React from 'react';
 | 
				
			||||||
 | 
					import classNames from 'classnames';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					type Props = {
 | 
				
			||||||
 | 
					  value: string;
 | 
				
			||||||
 | 
					  checked: boolean;
 | 
				
			||||||
 | 
					  name: string;
 | 
				
			||||||
 | 
					  onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
 | 
				
			||||||
 | 
					  label: React.ReactNode;
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export const RadioButton: React.FC<Props> = ({ name, value, checked, onChange, label }) => {
 | 
				
			||||||
 | 
					  return (
 | 
				
			||||||
 | 
					    <label className='radio-button'>
 | 
				
			||||||
 | 
					      <input
 | 
				
			||||||
 | 
					        name={name}
 | 
				
			||||||
 | 
					        type='radio'
 | 
				
			||||||
 | 
					        value={value}
 | 
				
			||||||
 | 
					        checked={checked}
 | 
				
			||||||
 | 
					        onChange={onChange}
 | 
				
			||||||
 | 
					      />
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      <span className={classNames('radio-button__input', { checked })} />
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      <span>{label}</span>
 | 
				
			||||||
 | 
					    </label>
 | 
				
			||||||
 | 
					  );
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					export default RadioButton;
 | 
				
			||||||
		Reference in New Issue
	
	Block a user