Web3 Netflix Helping Each Other


still getting these errors

import React from ‘react’;
import { Link } from “react-router-dom”;
import { useEffect } from ‘react’;
import “./Home.css”;
import { Logo } from ‘…/images/Netflix’;
import { ConnectButton, Icon, TabList, Tab, Button, Modal, useNotification } from “web3uikit”;
import { movies } from ‘…/helpers/library’;
import { useState } from ‘react’;
import { useMoralis } from ‘react-moralis’;

const Home = () => {

const { isAuthenticated, Moralis, account } = useMoralis();
const [visible, setVisible] = useState(false);
const [selectedFilm, setSelectedFilm] = useState();
const [myMovies, setMyMovies] = useState();
const dispatch = useNotification();

useEffect(() => {
async function fetchMyList() {

  try {
    const theList = await Moralis.Cloud.run("getMyList", { addrs: account });

    const filterdA = movies.filter(function (e) {
      return theList.indexOf(e.Name) > -1;
    });

    setMyMovies(filterdA);
    
  } catch (error) {
    console.error(error)
  }
}
fetchMyList();

}, [account]);

const handleNewNotification = () => {
dispatch({
type: “error”,
message: “Please Connect Your Wallet”,
title: “Not Authenticated”,
position: “bottomR”

})

}

these errors are related to a different part of the code.

To fix the second error, make sure you have added the appId and serverUrl in the MoralisProvider to start the server.

You can fix the first error by adding unique key values to the image component which is under Home.
image

i have done that in the index.js file. But doesnt seem to be recognizing it

Your server (qdogsfooe7zj) still doesn’t have this getMyList cloud function saved so that’s why calling it won’t work.

You need to specify a folder (either a full path, or relative path to where you run the command) with moralis-admin-cli watch-cloud-folder ..., not a file (cloudcode.js).

You can check your existing cloud code from the Cloud Functions page in server settings (from Moralis admin panel) - refresh the page after you upload any changes.

I am unable to understand the path,

MacBook-Pro-4:Netflix-Starter adenvaz$ moralis-admin-cli watch-cloud-folder --moralisApiKey mviuAMPn2Aev3nU --moralisApiSecret N7R7gCOlZcwCmwv --moralisSubdomain qdogsfooe7zj.usemoralis.com --autoSave 1 --moralisCloudfolder /Netflix-Starter/cloudcode.js

Is it the path to cloud code or some other folder?

The path is to the folder/directory where your cloudcode.js file is. So from your example, it is /Netflix-Starter/ without cloudcode.js as mentioned (if Netflix-Starter is inside the working directory when you run this command). Otherwise just specify a full path to the Netflix-Starter folder.

The terminal is already within the Netflix starter folder. So when i run MacBook-Pro-4:Netflix-Starter adenvaz$ moralis-admin-cli watch-cloud-folder --moralisApiKey mviuAMPn2Aev3nU --moralisApiSecret N7R7gCOlZcwCmwv --moralisSubdomain qdogsfooe7zj.usemoralis.com --autoSave 1 --moralisCloudfolder cloudcode.js

I get this
ncc: Version 0.29.2
ncc: Compiling file index.js into CJS
Changes Uploaded Correctly

But nothing works still

Again, you need to specify the directory, not the file that contains the cloud code. Don’t include cloudcode.js in the command.

If you are at Netflix-Starter as your terminal directory (that has the cloudcode.js file inside it), then use this command:

moralis-admin-cli watch-cloud-folder --moralisApiKey mviuAMPn2Aev3nU --moralisApiSecret N7R7gCOlZcwCmwv --moralisSubdomain qdogsfooe7zj.usemoralis.com --autoSave 1 --moralisCloudfolder ./

If that doesn’t work, go up one directory and then use:

moralis-admin-cli watch-cloud-folder --moralisApiKey mviuAMPn2Aev3nU --moralisApiSecret N7R7gCOlZcwCmwv --moralisSubdomain qdogsfooe7zj.usemoralis.com --autoSave 1 --moralisCloudfolder Netflix-Starter

ApiSecret N7R7gCOlZcwCmwv --moralisSubdomain qdogsfooe7zj.usemoralis.com --autoSave 1 --moralisCloudfolder ./
| Listening folder: ./[SyntaxError: ‘import’ and ‘export’ may appear only with ‘sourceType: module’] {
line: 1,
column: 1,
annotated: ‘\n’ +
‘./node_modules/@ant-design/colors/dist/index.esm.js:1\n’ +
“import { inputToRGB, rgbToHex, rgbToHsv } from ‘@ctrl/tinycolor’;\n” +
‘^\n’ +
“ParseError: ‘import’ and ‘export’ may appear only with ‘sourceType: module’”
}
[SyntaxError: ‘import’ and ‘export’ may appear only with ‘sourceType: module’] {
line: 1,
column: 1,
annotated: ‘\n’ +
‘./node_modules/@ant-design/colors/dist/index.esm.js:1\n’ +
“import { inputToRGB, rgbToHex, rgbToHsv } from ‘@ctrl/tinycolor’;\n” +
‘^\n’ +
“ParseError: ‘import’ and ‘export’ may appear only with ‘sourceType: module’”
}
[SyntaxError: ‘import’ and ‘export’ may appear only with ‘sourceType: module’] {
line: 1,

TypeError: Cannot read properties of undefined (reading ‘length’)
at Glob. (/opt/homebrew/lib/node_modules/moralis-admin-cli/commands/watchCloudFolder.js:96:56)
at Glob.f (/opt/homebrew/lib/node_modules/moralis-admin-cli/node_modules/once/once.js:25:25)
at Glob.emit (node:events:513:28)
at Glob.emit (node:domain:489:12)
at Glob._readdirError (/opt/homebrew/lib/node_modules/moralis-admin-cli/node_modules/glob/glob.js:610:14)
at /opt/homebrew/lib/node_modules/moralis-admin-cli/node_modules/glob/glob.js:553:12
at go$readdir$cb (/opt/homebrew/lib/node_modules/moralis-admin-cli/node_modules/@vercel/ncc/dist/ncc/index.js.cache.js:1:826734)
at FSReqCallback.oncomplete (node:fs:201:23)
| Listening folder: /

./node_modules/@ant-design/colors/dist/index.esm.js:1\n

Where is this use of ant-design coming from or what is in that cloudcode.js? Read this for what cloud functions/cloud code is for. You can’t import libraries like that.

Start with a simple comment inside cloudcode.js e.g. //uploaded to show that you can upload changes.

Hi, All

I am facing an issue, once i click the ‘sign’ button which prompts from metamask, nothing happens, my account also doesn’t connect and no error pops out too. It simply keeps prompting again and again!
Can anyone help please?

Can you check your browser console and your terminal for any errors. Have you put your correct Moralis server details in MoralisProvider?

My CSS Won’t Load When Deployed? But Works Fine on The Local Host , How Can I Fix That?

Do you have a link to your deployed site? Does it work locally (npm run build / yarn build and then serve the build folder with a local webserver)?

Make sure you’re not using generated class names in your CSS - these class names will change once deployed so they won’t work.

https://cordos.netlify.app/

Still need more info (see previous post). Can you post screenshots of what you mean exactly where CSS doesn’t load when deployed.

Check out https://cordos.netlify.app/ its not loading right