hi there, who knows how to make a query on press ?
# prisma-whats-new
v
hi there, who knows how to make a query on press ?
h
With params or without?
You can use withApollo and from props get client and have on click this.props.client.query
v
with params, I want to check If user already exist with username
i
I typically throw a method above
render()
. IE:
Copy code
export class Example extends React.Component {

  example() {
    // mutation
  }

  render() {
    return (
      <View>
        <Button onPress={() => this.example.bind(this)}>
          <Text></Text>
        </Button>
      </View>
    );
  }
}
v
@iamclaytonray you mean that I can put function " checkUsername" as this.props.checkUsername(somevalue) without adding this function to compose method ?
i
Yep
Can you shoot that code snippet over so I can copy/paste, and then return how I would do it?
You can avoid
compose
but have to change
graphql()
a bit, to add in props
v
Copy code
const checkUsername = graphql(CHECK_EXIST_USERNAME, { name: 'checkUsername',
    options: (ownProps) => ({
        variables: {
            username: "params from state here (input some value)"
        }
    })
});
const signupUser = graphql(SIGNUP_USER_MUTATION, { name: 'signUpUserMutation' });

const SignUpScreen = compose(
    signupUser,
    checkUsername
);
I don't know how to make a snippets
yes, I have a mutation "signupUser" but also I have a query "checkUsername" which consist the same code like that
Copy code
query {
  allUsers(filter: {username: "testUsername"}) {
    id
    fullName
    username
    email
    age
  }
}
and I want to check If user already exist with username, If exist, I will show error, if doesn't exist, then user can create a new user
i
Copy code
export const SignUpScreen = graphql(CHECK_EXIST_USERNAME, {
  options: (props) => ({
    variables: {
      username: props.username,
    }
  })
})(SignUpScreenContainer); // name of class components
Copy code
export class Example extends React.Component {
  render() {
    const { username } = this.props.navigation.state.params;
    return (
      <View>
        <SignUpScreen
          username={username}
          // etc
        />
      </View>
    );
  }
}
I haven’t tested any of that code out and I’m not 100% sure it’s all correct, but the basic idea behind it is correct.
variables
in the
graphql
HOC don’t take in the full prop. You add the
navigation.state.params... etc
to that component (
SignUpScreen
) and that’s how props are read from the HOC
v
ohhh
I'm afraid that you didn't understand me, I going to make a kind of search(filtering) for check all usernames in database, In your case we will get user info when component will receive props
i
Yep. So, basically, you would take a similar approach but add a conditional to check if that username exists. IE:
Copy code
if (username) {
  return; // return the user or do some other type of logic
} else {
  console.log('Error');
  return; // return some component with an error or something to that degree
}
Sorry… If you have a repro I can pull, I can better help