How to use react-adopt - 10 common examples

To help you get started, we’ve selected a few react-adopt examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github phiilu / mailman / frontend / src / pages / Dashboard.js View on Github external
domain
      accounts {
        count
      }
    }
  }
`;

const DELETE_DOMAIN_MUTATION = gql`
  mutation DELETE_DOMAIN_MUTATION($domainId: Int!) {
    deleteDomain(id: $domainId)
  }
`;

/* eslint-disable */
const GraphQLComposed = adopt({
  domainsQuery: ({ render }) => (
    {render}
  ),
  domainsDeleteMutation: ({ render }) => (
    {render}
  )
});
/* eslint-enable */

class Dashboard extends React.Component {
  state = {
    dialog: {
      open: false,
      title: "New Dialog",
      form: null
    },
github phiilu / mailman / frontend / src / components / AccountList.js View on Github external
id
      email
      username
      domain {
        id
        domain
      }
      quota
      enabled
      sendonly
    }
  }
`;

/* eslint-disable */
const GraphQLComposed = adopt({
  domainsQuery: ({ render }) => (
    {render}
  ),
  accountsQuery: ({ render }) => (
    
      {render}
    
  ),
  accountDeleteMutation: ({ render }) => (
    {render}
  ),
  accountUpdateMutation: ({ render }) => (
    
      {(updateAccount, result) => render({ updateAccount, result })}
    
  )
github jaridwarren / ecommerce-react-graphql / frontend / components / Cart.js View on Github external
import TakeMyMoney from './TakeMyMoney';

// '@client' tag prevents from query going to server
const LOCAL_STATE_QUERY = gql`
  query {
    cartOpen @client
  }
`;

const TOGGLE_CART_MUTATION = gql`
  mutation {
    toggleCart @client
  }
`;

const Composed = adopt({
  user: ({ render }) => {render},
  toggleCart: ({ render }) => (
    {render}
  ),
  localState: ({ render }) => {render}
});

const Cart = () => (
  
    {({ user, toggleCart, localState }) => {
      const { me } = user.data;
      if (!me) return null;
      return (
        
          <header>
            </header>
github ahrbil / TDI-Exchange / packages / web / src / components / question-details / details.js View on Github external
import Button, { TextButton, IconButton } from "../button";
import DropDown, { DropDownItem } from "../drop-down";
import { Text } from "../drop-down/style";
// import { formatError } from "../../utils";

const QuestionMutation = ({ render }) =&gt; (
  
    {(deleteQuestion, result) =&gt; render({ deleteQuestion, result })}
  
);

const CurrentUser = ({ render }) =&gt; (
  {({ currentUser }) =&gt; render({ currentUser })}
);

const Composed = adopt({
  mutation: QuestionMutation,
  authUser: CurrentUser
});

const Details = ({
  question,
  currentPage,
  handlePaginationChange,
  loading,
  isEditing,
  setIsEditing,
  skip,
  orderByAnswers
}) =&gt; {
  const { isOwner } = question;
  const [modalOpen, setModalOpen] = React.useState(false);
github OffCourse / offcourse-next / packages / app / src / providers / CheckpointProvider / Provider.js View on Github external
query={queries.checkpoint}
        variables={{ checkpointQuery, isAuthenticated: !!userName }}
      &gt;
        {({ data }) =&gt; {
          return render(data.checkpoint);
        }}
      
    );
  }
};

const mapProps = ({ userName, checkpoint }) =&gt; ({
  checkpoint
});

export default adopt(mapper, mapProps);
github OffCourse / offcourse-next / packages / app / src / providers / FlashProvider / Provider.js View on Github external
const _push = async (variant, message) => {
    const variables = { message, variant };
    await addMessage({ variables });
    removeMessage();
  };
  const push = curry(_push);
  return {
    messages,
    success: push(POSITIVE),
    warning: push(WARNING),
    info: push(INFO),
    error: push(NEGATIVE)
  };
};

export default adopt(mapper, mapProps);
github OffCourse / offcourse-next / packages / app / src / providers / CourseProvider / index.js View on Github external
courseQuery,
  course
}) => ({
  course,
  courseQuery,
  userName,
  userIsCurator: course && course.curator === userName,
  toggleCheckpoint: updateStatus(update),
  fork: fork(forkCourse),
  save: save(saveCourse, {
    courseId,
    curator: userName
  })
});

export default adopt(mapper, mapProps);

react-adopt

- [Why](#--why) - [Solution](#--solution) - [Demos](#--demos) - [Usage](#--usage-demo) - [Working with new Context api](#working-with-new-context-api) - [Custom render and retrieving props from composed](#custom-render-and-retrieving-props-from-composed)

MIT
Latest version published 6 years ago

Package Health Score

51 / 100
Full package analysis

Popular react-adopt functions