import React from 'react'

import Loading from '../Loading'

/**
 * Loading state component
 */
export const LoadingState = React.memo(() => (
  <div className="messaging-loading-state flex items-center justify-center h-full">
    <div className="flex items-center">
      <Loading className="w-6 h-6" />
      <span className="text-sm text-stone">Loading messages</span>
    </div>
  </div>
))
LoadingState.displayName = 'LoadingState'