I am getting the following error on else if below. I already removed the last pure Else statement, and Lint is still giving an error on ElseIf. How can I resolve?

error Unnecessary 'else' after 'return'

  const renderBody = () => {
    if (loading) {
      return <Skeleton variant="rect" width="100%" height={130} />;
    } else if (productListData?.length > 0) {
      return (
        <Box width="100%">
          {productListData?.map(product => (
            <ProductCollectedRow
              key={product.productId}
              patientId={patientId}
              serviceLocationGuid={serviceLocationGuid}
              product={product}
              receiptRequest={receiptRequest}
            />
          ))}
      );
    }
    return (
      <Box
        width="300px"
        height="150px"
        border={1}
        borderColor="grey.300"
        display="flex"
        justifyContent="center"
        alignItems="center"
      >
        No products collected yet
      </Box>

CodePudding user response：

Since you are returning if loading, the else keyword is redundant in your else if, so simply remove it and leave only if.