gabrielEloy

const handleLogin = () => {
    Parse.User.logIn(username, password).then(user => {
      router.push("/home");
    });
  };

gabrielEloy

//pre-existing imports here
import { encodeParseQuery } from "@parse/react-ssr";
import Parse from "parse";

export async function getServerSideProps() {
  const parseQuery = new Parse.Query("Message");

  return {
    props: {
      parseQuery: await encodeParseQuery(parseQuery), // Return encoded Parse Query for server side rendering

gabrielEloy

export default function Auth({ parseQuery }) {
  const { results } = useParseQuery(parseQuery);
  const [messages, setMessages] = useState([]);
  const [inputMessage, setInputMessage] = useState("");

gabrielEloy

export default function Auth({ parseQuery }) {
  const { results: messages } = useParseQuery(parseQuery);
  const [inputMessage, setInputMessage] = useState("");

gabrielEloy

export async function getServerSideProps() {
  //pre-existing component code
  const messageClassName = (id) =>
    id === Parse.User.current().id ? styles.myMessage : null;
  (
    <div className={styles.container}>
      <div className={styles.messagesContainer}>
        <ul ref={listRef}>
          {messages &&
            messages.map((message, id) => (

gabrielEloy

const handleSubmitMessage = (e) => {
    e.preventDefault();
    const Message = Parse.Object.extend("Message");
    const newMessage = new Message();
    newMessage.save({
      content: inputMessage,
      senderName: Parse.User.current().get('username'),
      senderId: Parse.User.current().id,
    });
    setInputMessage("");

gabrielEloy

export default function Auth({ parseQuery }) {
    //pre existing functions 
  const order = (messages) => messages.sort((a, b) => a.get("createdAt") - b.get("createdAt"))

  return (
    <div className={styles.container}>
      <div className={styles.messagesContainer}>
        <ul ref={listRef}>
          {messages &&
            order(messages).map((message, id) => (

gabrielEloy

const router = useRouter();
useEffect(() => {
    async function checkUser() {
      const currentUser = await Parse.User.currentAsync();
      if (!currentUser) {
        router.push("/");
      }
    }
    checkUser();
  }, []);

gabrielEloy

export async function getServerSideProps() {
  const parseQuery = new Parse.Query("Message");
  parseQuery.ascending("createdAt");
  parseQuery.greaterThanOrEqualTo('createdAt', new Date());

  return {
    props: {
      parseQuery: await encodeParseQuery(parseQuery), // Return encoded Parse Query for server side rendering
    },
  };

gabrielEloy

import { useLayoutEffect, useState, useRef, useEffect } from "react";
import styles from "../styles/Home.module.css";
import { encodeParseQuery, useParseQuery } from "@parse/react-ssr";
import Parse from "parse";
import { useRouter} from 'next/router';

export async function getServerSideProps() {
  const parseQuery = new Parse.Query("Message");
  parseQuery.ascending("createdAt");
  parseQuery.greaterThanOrEqualTo('createdAt', new Date());