parse-community/parse-react

[EXPERIMENTAL] React, React Native, and React with SSR (e.g. Next.js) packages to interact with Parse Server backend

parse-react's Issues

Query results are empty during reload()

It seems that when reload() is called on a query, the results become null until the query returns.

I think it would be much better if the results kept their existing value while the query is fetching results. This allows for a more seamless experience in the UI.

Take the below example:

const query = new Parse.Query('Project')
query.get(projectId)
const { results, reload } = useParseQuery(query)

const project = (results && results.length) ? results[0] : null

// If the project is empty then show a blank page while it loads
if (!project) return null

const updateProject = async () => {
  // Make some updates to the project
  project.add('locations', 'another')
  await project.save()
  reload()
}

return (
  <div>
    <Button onClick={updateProject}>
      Update Project
    </Button>
    { // List the project locations
      project.get('locations').map(location => <div>{location}</div>)
    }
  </div>
)

In this example, I am updating the Project when the button is clicked, and reloading the project object.
Right now, the page will go blank while the project reloads.
But if the project kept it's value during reload, then it would just get updated when the new project object returned.

I hope this makes sense. I'm happy to discuss more if helpful.
Thanks!

Use in Next.js without getServerSideProps?

Is it possible to use @parse/react-ssr without having to encode the query inside getServerSideProps?
I would like to have a static page that accesses parse from the front-end, but using getServerSideProps forces it to be server-side rendered.
Thanks!

Is there a reason for this effort to exist?

Genuinely curious, why does this exist? i know its experimental & alpha, but I am trying to understand the advantages of loading Parse this way
from what I see here: https://github.com/parse-community/parse-react/blob/master/packages/parse-react/src/index.ts

The function is simply making Parse Global ( which some might argue is a bad idea). This abstracts the 3 lines of code, but breaks code completion as IDEs cannot see a Parse import statement on any other pages. Moreover, its opaque about what this actually does, Maybe we should add some more lines to docs that it simply initializes Parse & enables local storage. ( will be happy todo so ).

If we think this has to be done, at least we should return the Parse Object from here and then state in the usage section of the docs to set this Parse var as global so that the code remains testable?

SSR localStorage is not defined when using query.find()

export const getServerSideProps: GetServerSideProps = async ({ params }) => {
  const query = new Parse.Query('Job')
  query.find(params.id)

  return {
    props: {
      parseQuery: await encodeParseQuery(query),
    },
  }
}

Server Error
ReferenceError: localStorage is not defined

This error happened while generating the page. Any console logs will be displayed in the terminal window.

Abandoned?

Question Is this abandoned
I am asking because i need to use Parse in NextJS server
So if it is abandoned and no new update is in progress or in near future then i can just use parseJS
kindly guide me because the last update is 6 month ago and it is still in alpha version

Not able to encrypt data for current user after using enableEncryptedUser

Hi,

Problem: current user data is in plain text form, anyone one access and read
Solution tried: i just checked parse documents and found this link https://docs.parseplatform.org/js/guide/#encrypting-current-user, but it's not encrypting data as checked by appsec team
Technology: React Native

versions
react-native: 0.68.7
parse: 3.5.1

basic code:

import Parse from 'parse/react-native.js';
const {APP_ID, BASE_URL, PARSE_SECRET} = env

Parse.enableEncryptedUser();
Parse.secret = PARSE_SECRET;
Parse.setAsyncStorage(AsyncStorage);
Parse.initialize(APP_ID);
Parse.serverURL = BASE_URL;

How to use master key

I'm not able to use masterkey as I'm building a custom dashboard and I need it.

Feature request: enabled option

I'd like to request a feature. It would be helpful to disable a query from running in some situations, until a condition is met.

I think adding an option enabled to go alongside enableLocalDatastore and enableLiveQuery would do the trick.

The problem that I have is when using parse-react-ssr with Next.js (but using client-side only), when I use the next/router to get a document id from the query string, it can be undefined for a short time while the page loads. So I end up having to check if the id is not null:

  const router = useRouter()
  const projectId = router.query.projectId
  const query = new Parse.Query('Project')

  if (projectId) {
    query.get(projectId)
  }

  const { results } = useParseQuery(query)

If there was an enabled flag, then I could do this:

  const { results } = useParseQuery(query, { enabled: !!projectId })

Another way this flag could be helpful is to allow a query to be dependent on another. For example, if we first needed to lookup the project before we could look up something dependent on the project.

What do you think?
Thanks!

Parse react SSR not initialising in next js

RESTController.js?a3b1:331 Uncaught TypeError: Cannot read property 'length' of undefined
    at Object.request (RESTController.js?a3b1:331)
    at eval

Hi I am initialising parse using the code in the package doc.
I used to use parse js sdk where I only used 2 things, the app id and server URL.

here it also had Javascript key. So I added my parse master key
Still no luck

useParseQuery subscription

I'd like to request a feature / bug useParseQuery works good in mount/unmout scnearios, but with react-navigation they dont have this lifecycles so it is impossible to use useParseQuery because it will keep requesting / updating other Screens, and I think with this will bring other level of customization, ex: click on somthing and being able to stop requesting live.

It could actually be a solution to use the enableLiveQuery to start/stop at any time
Is it possible to change enableLiveQuery on options and will it start / stop

The main objective is something like this

import { useIsFocused } from '@react-navigation/native';
import React,{ useEffect} from 'react';
// ...

function App() {
  const isFocused = useIsFocused();
  const {results,liveQuerySubscription} = useParseQuery(query);

useEffect(()=>{
if(!isFocused ){
// stop requesting
 liveQuerySubscription.unsubscribe();
}

},[isFocused ])

  return <Text>{isFocused ? 'focused' : 'unfocused'}</Text>;
}

But exporting the liveQuerySubscription maybe would not be the greatest solution because when we return to the same srceen we, mount event will not be trigered and we want to start requesting again...

What you guys think would be the best solution?

query.toJson() is not a function

Trying to connect to my parse server on anon login and when trying to read results console throws this error. Any ideas?

Disable local storage not functioning

First off, thanks for putting together this library, it's awesome to see parse alive and well.
For some reason, passing the boolean flag to disable the 'enableLocalDatastore' option when calling the useParseQuery method using the @parse/react-ssr module does not appear to disable the corresponding functionality. I took a look at the type definitions and everything seems to be in order, however I still haven't gotten it to work. I am returning the following from a custom hook called in a functional component being rendered on the client side (using Next.js dynamic component)

Hook Call

export const useData = () => {
   return useParseQuery(parseQuery, { enableLocalDatastore: false })
}

Functional Component Call

export const Component = () => {
  const results = useData()
  return (
     <div>{results.map((item, idx) => ( 
             <div>{item}</div>
       ))}
    </div>
  )
}

Expected behaviour: data not set in local storage
Actual behaviour: data is still being set (and eating up) local storage.

Thanks in advance for any advice - cheers!

useParseQuery(query) returns previous results when passed a new query

const { isLive, isSyncing, isLoading, results, error } = useParseQuery(query);

1. when query changes you get

{ results: resultsOfPreviousQuery, isLoading: false, isLive: true, isSyncing: false, error: undefined }

2. a little later you get a re-rerender with the appropriate response

{ results: undefined,  isLoading: true, isLive: true, isSyncing: false, error: undefined }

3. and when the fetching is done

{ results: newResults, isLoading: false, isLive: true, isSyncing: false, error: undefined }

Response (2) should be what's returned at step (1). A new query shouldn't return results from a previous one.

@parse/react-ssr 0.0.1-alpha.17

---

Here's a page for reproducing it:

import { initializeParse } from '@parse/react-ssr';
import { useEffect, useState } from 'react';
import { useParseQuery } from '@parse/react-ssr';

initializeParse(
  process.env.NEXT_PUBLIC_PARSE_SERVER_URL!,
  process.env.NEXT_PUBLIC_PARSE_APP_ID!,
  process.env.NEXT_PUBLIC_PARSE_JS_KEY!
);

const OBJECT_CLASS = 'Showtime';

interface LogEntry {
  requestedId?: string;
  resultId?: string;
  isLoading: boolean;
  isSyncing: boolean;
  isLive: boolean;
  error?: Error;
}

export default function FalseZero() {
  const [ids, setIds] = useState<string[]>([]);
  const [requestedId, setRequestedId] = useState('');
  const [log, setLog] = useState<LogEntry[]>([]);

  const query = new Parse.Query(OBJECT_CLASS).equalTo('objectId', requestedId);
  const { isLive, isSyncing, isLoading, results, error } = useParseQuery(query);
  const resultId = results?.[0]?.id;

  // log results when they change
  useEffect(() => {
    setLog((prev) => [...prev, { requestedId, resultId, isLoading, error, isLive, isSyncing }]);
  }, [requestedId, resultId, isLoading, error, isLive, isSyncing]);


  // on mount, load valid ids
  useEffect(() => {
    new Parse.Query(OBJECT_CLASS)
      .find()
      .then((results) => setIds(getIds(results)))
      .catch(console.error);
  }, []);

  // request a random id
  function fetchRandomObject() {
    if (!ids?.length) return;
    const i = Math.floor(Math.random() * ids.length);
    setRequestedId(ids[i]);
  }

  if (!ids?.length) return <>no ids yet</>;

  return (
      <>
        <button className={'btn btn-sm btn-primary'} onClick={fetchRandomObject}>
          fetch
        </button>
        <button className={'btn btn-sm btn-primary ml-2'} onClick={() => setLog([])}>
          clear log
        </button>
        <p>{resultId}</p>
        <p>---</p>
        <p>{log.length} entries</p>
        {log.map(reportLogEntry)}
      </>
  );
}

function reportLogEntry(entry: LogEntry, i: number) {
  const { isLoading, error, requestedId, resultId, isSyncing, isLive } = entry;
  const bad = !isLoading && !error && requestedId !== resultId;
  return (
    <p key={i} style={{ marginTop: '1em', color: bad ? 'red' : 'black' }}>
      requested: {requestedId || '[none]'}
      <br />
      result: {resultId || '[none]'}
      <br />
      isLoading: {isLoading ? 'true' : 'false'}
      <br />
      error: {entry.error?.message || '[none]'}
      <br />
      isLive: {isLive ? 'true' : 'false'}
      <br />
      isSyncing: {isSyncing ? 'true' : 'false'}
    </p>
  );
}

function getIds(list: { id: string }[]) {
  return list.map(({ id }) => id);
}

I have a question about updating and continuing this library.

Hello guys, I hope you are well, I would like to know if this repo will continue and be updated. If so, how can I contribute?

[issue] Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.

[Sat Jun 05 2021 14:37:43.521]  BUNDLE  ./index.tsx 

[Sat Jun 05 2021 14:37:46.691]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseACL.js -> ../../node_modules/parse/lib/react-native/ParseRole.js -> ../../node_modules/parse/lib/react-native/ParseACL.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.693]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.694]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/arrayContainsObject.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.695]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/decode.js -> ../../node_modules/parse/lib/react-native/ParseACL.js -> ../../node_modules/parse/lib/react-native/ParseRole.js -> ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/decode.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.697]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseACL.js -> ../../node_modules/parse/lib/react-native/ParseRole.js -> ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/encode.js -> ../../node_modules/parse/lib/react-native/ParseACL.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.697]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/encode.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.698]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/encode.js -> ../../node_modules/parse/lib/react-native/ParseOp.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.699]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/encode.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.701]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.703]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.704]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseOp.js -> ../../node_modules/parse/lib/react-native/unique.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.708]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.709]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseQuery.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.715]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseACL.js -> ../../node_modules/parse/lib/react-native/ParseRole.js -> ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseQuery.js -> ../../node_modules/parse/lib/react-native/OfflineQuery.js -> ../../node_modules/parse/lib/react-native/equals.js -> ../../node_modules/parse/lib/react-native/ParseACL.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.718]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseQuery.js -> ../../node_modules/parse/lib/react-native/OfflineQuery.js -> ../../node_modules/parse/lib/react-native/equals.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.720]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/decode.js -> ../../node_modules/parse/lib/react-native/ParseACL.js -> ../../node_modules/parse/lib/react-native/ParseRole.js -> ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/canBeSerialized.js -> ../../node_modules/parse/lib/react-native/ParseRelation.js -> ../../node_modules/parse/lib/react-native/ParseQuery.js -> ../../node_modules/parse/lib/react-native/OfflineQuery.js -> ../../node_modules/parse/lib/react-native/decode.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.721]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/decode.js -> ../../node_modules/parse/lib/react-native/ParseACL.js -> ../../node_modules/parse/lib/react-native/ParseRole.js -> ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/decode.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.722]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/EventuallyQueue.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.722]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseACL.js -> ../../node_modules/parse/lib/react-native/ParseRole.js -> ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/ParseACL.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.722]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/SingleInstanceStateController.js -> ../../node_modules/parse/lib/react-native/ObjectStateMutations.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.723]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseObject.js -> ../../node_modules/parse/lib/react-native/unsavedChildren.js -> ../../node_modules/parse/lib/react-native/ParseObject.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.724]  WARN     Require cycle: ../../node_modules/parse/lib/react-native/ParseUser.js -> ../../node_modules/parse/lib/react-native/ParseSession.js -> ../../node_modules/parse/lib/react-native/ParseUser.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.
[Sat Jun 05 2021 14:37:46.725]  LOG      Running "MonorepoApp" with {"rootTag":351,"initialProps":{}}

useParseQuery close livequery fail, set options doesn't work

1. When I use useParseQuery func

const { isLive, isSyncing, isLoading, results, error } = useParseQuery(query, {
    enableLiveQuery: false //  not work.
});

2. This still turns on LiveQuery

3. I found the problem

parse-react-ssr
In parse-react-ssr, when I set enableLiveQuery false, this is always going to be undefined.

parse-react-base
In parse-react-base, when undefined is received, it is always set to true.

Results in react native always []

Hi there,

the results in react native are always []. I've tried to implement it in an own app and also tried to use the demo example.
Is the package already usable in react native?

Thanks!

Does not compile when added, Failed to parse source maap

I installed npm install parse @parse/react --save in my react JS project.
used it like
import { initializeParse } from '@parse/react';

initializeParse(
'YOUR_SERVER_URL',
'YOUR_APPLICATION_ID',
'YOUR_JAVASCRIPT_KEY'
);
I get this error.

Failed to parse source map from '.../node_modules/@parse/react/src/index.ts' file: Error: ENOENT: no such file or directory, open '.../node_modules/@parse/react/src/index.ts'

Depends on old version of react-native cli with vulnerabilities in transitive dependencies

Hi,

I am trying to upgrade a project to react native 0.69.1, which depends on clii 8.0.2, but i am stuck with cli 5.0.1, which has dependencies with vulnerabilities, since parse/react-native is pulling it in.

Could you please update the deps to a newer version with no vulnerabilities?

PS C:\Users\markx\AndroidStudioProjects\CloudBank\microservices-datadriven\cloudbank\cloudbank-react-native> npm list @react-native-community/cli
[email protected] C:\Users\markx\AndroidStudioProjects\CloudBank\microservices-datadriven\cloudbank\cloudbank-react-native
├─┬ @parse/[email protected]
│ └─┬ @react-native-async-storage/[email protected]
│   └─┬ [email protected]
│     └── @react-native-community/[email protected]
└─┬ [email protected] invalid: "^0.0.0-0 || 0.60 - 0.68 || 1000.0.0" from node_modules/@react-native-async-storage/async-storage
  └── @react-native-community/[email protected]

Error when bundling the npm distro with Vite.

When trying to import the @parse/react library using the npm distro and bundling with vite, the import fails with the following error:

inherits.js:9 Uncaught TypeError: Super expression must either be null or a function
    at _inherits (inherits.js:9:11)
    at LiveQueryClient.js:274:18
    at node_modules/parse/lib/browser/LiveQueryClient.js (LiveQueryClient.js:759:1)
    at __require2 (chunk-W7STUX7H.js?v=aa49bf2b:18:50)
    at node_modules/parse/lib/browser/ParseLiveQuery.js (ParseLiveQuery.js:25:47)
    at __require2 (chunk-W7STUX7H.js?v=aa49bf2b:18:50)
    at node_modules/parse/lib/browser/Parse.js (Parse.js:339:19)
    at __require2 (chunk-W7STUX7H.js?v=aa49bf2b:18:50)
    at node_modules/parse/index.js (index.js:1:18)
    at __require2 (chunk-W7STUX7H.js?v=aa49bf2b:18:50)

This is another example of this issue: parse-community/Parse-SDK-JS#1362 from the Parse-sdk-js repo, and the error stems from the same line of code. The following .jsx file will reproduce the issue.

import * as React from 'react';

import { initializeParse } from '@parse/react';

function App() {
  return (
      <h1> Hello</h1>
  );
}

export default App;

Parse.initialize error when using env variable

hello👋🏻, I got error Error: You need to call Parse.initialize before using Parse. when i am using environment variable, but when I try to use NEXT_PUBLIC_, i works fine.

i have security concern when using NEXT_PUBLIC_, is there anything i should try?

this is my next js _app.js file

// Client-side cache, shared for the whole session of the user in the browser.
const clientSideEmotionCache = createEmotionCache();

interface MyAppProps extends AppProps {
  emotionCache?: EmotionCache;
}

const layouts: any = {
  Blank: BlankLayout,
};

initializeParse(
  process.env.PARSE_SERVER_URL ?? "",
  process.env.PARSE_APP_ID ?? "",
  process.env.PARSE_JS_KEY ?? ""
);

const MyApp = (props: MyAppProps) => {
  const {
    Component,
    emotionCache = clientSideEmotionCache,
    pageProps,
  }: any = props;
  const theme = ThemeSettings();
  const Layout = layouts[Component.layout] || FullLayout;

  return (
    <CacheProvider value={emotionCache}>
      <Head>
        <meta name="viewport" content="initial-scale=1, width=device-width" />
        <title>Modernize NextJs Admin template</title>
      </Head>
      <ThemeProvider theme={theme}>
          <CssBaseline />
          <Layout>
            <Component {...pageProps} />
          </Layout>
      </ThemeProvider>
    </CacheProvider>
  );
};

export default (props: MyAppProps) => (
  <Provider store={Store}>
    <MyApp {...props} />
  </Provider>
);

parse in nextJS SSR

hello i want to ask about how can we initialize parse in Next js? is it in _app or i should create class to init it?

initializeParse(
  'YOUR_SERVER_URL',
  'YOUR_APPLICATION_ID',
  'YOUR_JAVASCRIPT_KEY'
);

[issue] Can't run on RN 0.64

Platform : ios, android
JS Engine : hermes
Uncaught Error : "Cannot read property 'addListener' of undefined"

My package.json :
"react": "17.0.1",
"react-native": "0.64.0",
"@parse/react-native": "^0.0.1-alpha.15",
"parse": "^3.2.0",
"axios": "^0.21.1",
"@react-native-async-storage/async-storage": "^1.15.4"

Add ability to use another local storage instead of AsyncStorage

is it possible to use another local storage like RN MMKV-storage instead of AsyncStorage ?

I've tried something like this:

import Parse from 'parse/react-native';
import {MMKV} from './mmkv';

Parse.setAsyncStorage(MMKV); //here's i used MMKV instead of AsyncStorage
Parse.initialize('APP ID', 'JS ID');
Parse.serverURL = 'Server URL';

export const register = async (email, password) => {
  try {
    return await Parse.User.signUp(email, password);
  } catch (error) {
    alert(error);
  }
};

and an error appear

error XMLHttpRequest failed: "this.getAsyncStorage is not a function. (In 'this.getAsyncStorage()', 'this.getAsyncStorage' is undefined)"

dependencies:

"parse": "^3.5.0-beta.1",
"react-native-mmkv-storage": "^0.8.0",

but when i used
"parse": "^3.4.4",
there's no error and i think Parse class get stuck in

export const register = async (email, password) => {
  try {
    console.log('start') //appear
    return await Parse.User.signUp(email, password); //stuck here
    console.log('end') //never called
  } catch (error) {
    alert(error);
  }
};

Details of useParseQuery's isLive and isSyncing

Hi, thank you for this library. I know it is still in alpha and you're looking for feedback - I think the direction of this is right on track.

I'm starting a project with Next.js and Parse. The useParseQuery hook works much like react-query, which is exactly what I'm looking for. But I'd like some more information on isLive and isSyncing.

This is what I started with, which I expected would work:

  const {
    isLoading,
    results,
    error
  } = useParseQuery(parseQuery)

  if (isLoading) return <Spinner />
  if (error) return <ErrorMessage error={error} />
  if (!results || !results.length) return <ErrorMessage error='Project not found' />

  // Otherwise display the project info...
  return (
    // Project info
  )

The above resulted in a error message flashing for a second "Project not found" until the project object was loaded (this is just after creating a new project object in the parse db).

If I add checks for isLive and isSyncing, then the error message does not show.

  if (!isLive || isLoading || isSyncing) return <Spinner />

I would expect that checking isLoading would be enough. Do I need to also check isLive and isSyncing?

Thank you!
Raymond

any example of post ?

Is there any example for creating or do WE just need to use as described in JS SDK ?

initializeParse(
'YOUR_SERVER_URL',
'YOUR_APPLICATION_ID',
'YOUR_JAVASCRIPT_KEY'
);
What Is "YOUR_JAVASCRIPT_KEY' ?

is this npm based on react query? as it same methodology to fetch data