classic solution

import React, { Component } from 'react';
import { Image, Button, Icon} from 'semantic-ui-react';
import Style from './card1.module.css';
import Photo from '../food.jpg';

class Card1 extends Component {
    constructor(props) {
        super(props);
        
        const {
            image,
            title,
            description
        } = props;

        this.state = {
            image: image || Photo,
            title: title || 'Experimente nosso Bife Grelhado',
            description: description || 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt'
        };
    }

    componentDidUpdate() {
        const {
            image,
            title,
            description
        } = this.props;

        this.setState({
            image: ,image || this.state.image,
            title: ,title || this.state.title,
            description: description || this.state.description
        });
    }

    shouldComponentUpdate(nextProps) {
        const {
            image,
            title,
            description
        } = nextProps;

        const {
            image: oldImage,
            title: oldTitle,
            description: oldDescription
        } = this.props;

        return image !== oldImage || 
            title !== oldTitle ||
            description !== oldDescription;
    }

    render() {
        return (
            <div className={Style.card}>
                <Image src={this.state.image} />
                <div className={Style.content}>
                    <h2 className={Style.title}> {this.state.title}</h2>
                    <div className={Style.description}> {this.state.description} </div>
                    <div className={Style.btnGroup}>
                        <Button basic size='tiny' color="green">
                            <Icon name="heart"/> Gostei
                        </Button>
                        <Button basic size='tiny' color="red">
                            <Icon name="cancel"/> Não Gostei
                        </Button>
                    </div>
                </div>
            </div>
        );
    }
}

export default Card1;

preferred solution

import { Image, Button, Icon} from 'semantic-ui-react';
import Style from './card1.module.css';
import Photo from '../food.jpg';

// https://hackernoon.com/react-stateless-functional-components-nine-wins-you-might-have-overlooked-997b0d933dbc
export default props => {
    const {
        image = Photo,
        title = 'Experimente nosso Bife Grelhado',
        description = 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt'
    } = props;

    return (
        <div className={Style.card}>
            <Image src={image} />
                <div className={Style.content}>
                    {title && (
                        <h2 className={Style.title}> {title}</h2>
                    )}
                    {description && (
                        <div className={Style.description}> {description} </div>
                    )}
                    <div className={Style.btnGroup}>
                        <Button basic size='tiny' color="green">
                            <Icon name="heart"/> Gostei
                        </Button>
                        <Button basic size='tiny' color="red">
                            <Icon name="cancel"/> Não Gostei
                        </Button>
                    </div>
                </div>
            </div>
        );
};