Only discussions should say "Join the conversation"

[esot321c]

Other proposals should have other information

[glasgowm148]

Should be something like this I think, but can't test as I can't see the proposals when hosting locally.

Update ProposalCard.tsx getFooter

const getFooter = () => {
  const footerFont = {
    xs: "1rem",
    sm: "1rem",
    md: ".8rem",
    lg: ".9rem",
    xl: "1rem",
  };
  const footerSmallFont = {
    xs: ".9rem",
    sm: ".9rem",
    md: ".8rem",
    lg: ".7rem",
    xl: ".8rem",
  };

  switch (props.status) {
    case "Challenged":
    case "Active":
      return <VoteWidget yes={props.yes} no={props.no} />;
    case "Passed":
      return (
        <Box sx={{ p: ".5rem", height: "4rem", display: "flex", alignItems: "center" }}>
          <Typography sx={{ width: "100%", textAlign: "center", color: "success.light", fontSize: footerFont }}>
            Vote Passed!
          </Typography>
        </Box>
      );
    case "Discussion": {
      const totalUsers = [
        ...new Set(props.comments.map((item) => item.user_id)),
      ].length;
      const totalComments = props.comments.length;

      return (
        <ButtonBase
          sx={{
            p: ".5rem",
            height: "4rem",
            width: "100%",
            display: "flex",
            alignItems: "center",
            textAlign: "left",
          }}
          draggable="false"
          onMouseDown={() => {
            setMoved(false);
          }}
          onMouseMove={() => {
            setMoved(true);
          }}
          onMouseUp={() => {
            if (!moved) {
              router.push(
                (dao === undefined ? "" : `/${dao}/`) +
                `${!props.is_proposal ? "discussion" : "proposal"}/${generateSlug(props.id, props.name)}?tab=comments`
              );
            }
          }}
        >
          <Box sx={{ width: "100%", fontSize: footerFont }}>
            <Typography sx={{ mb: "4px" }}>Join the Conversation</Typography>
            <Box sx={{ fontSize: footerSmallFont, color: "text.secondary" }}>
              {totalComments} comment{totalComments === 1 ? "" : "s"} from {totalUsers} user{totalUsers === 1 ? "" : "s"}
            </Box>
          </Box>
        </ButtonBase>
      );
    }
    case "Unchallenged":
      return <CountdownWidget date={props.date} />;
    case "Failed":
    case "Failed - Quorum":
    case "Failed - Vote":
      return (
        <Box sx={{ p: ".5rem", height: "4rem", display: "flex", alignItems: "center" }}>
          <Typography sx={{ width: "100%", textAlign: "center", color: "error.light", fontSize: footerFont }}>
            Vote Failed
          </Typography>
        </Box>
      );
    default:
      return null;
  }
};