NextJs Error - Invalid getServerSideProps Return Value

This error caused inside getServerSideProps code block when the props return values does not follow the required structure .

The return value should have a "props" as key and then {"propertytKeyAsString":anyValidData }.
Here:

• "propertytKeyAsString" - the key (name) you assign for the property. This will be de-structured to get property value inside the page component .
• "anyValidData" includes any valid data type that can be assigned  , it could be number , string , boolean, array , objects & null .
• Caution do not try to pass values of "undefined" data type , this will cause a different error .

To fix Invalid getServerSideProps Return Value 

Follow the required props structure and return a valid data

export async function getServerSideProps() {

//anyValidData can be number , string , boolean , array , objects & null
// but do not pass undefined
// keep in mind these will be serialized (aka made into valid json )

  return {
    props: { yourObjectKey: anyValidData , yourObjectKey2: anyValidData2 }
  }
}

You might also encounter other errors when using the getServerSideProps :

• `undefined` cannot be serialized as JSON. Please use `null` or omit this value.
• Your `getServerSideProps` function did not return an object. Did you forget to add a `return`?
• You can not use getStaticProps with getServerSideProps. To use SSG, please remove getServerSideProps