smolinari

import { ApolloClient } from 'apollo-client'
import { InMemoryCache } from 'apollo-cache-inmemory'
import VueApollo from 'vue-apollo'
import fetch from 'node-fetch'
import { createHttpLink } from 'apollo-link-http'

const httpLink = createHttpLink({ uri: 'http://localhost:4000/graphql', fetch: fetch })

// Create the apollo client
const apolloClient = new ApolloClient({

smolinari

apolloClientConfigObj.cache.writeData({
  data: {
    todos: [],

    networkStatus: {
      __typename: 'NetworkStatus',
      isConnected: false
    },

    filters: [

smolinari

<template>
  <div class="q-pa-sm text-center">
    <q-btn
      color="primary"
      v-for="(filter, index) in filters"
      :flat="!filter.active"
      :key="index"
      @click="setFilter(filter.name)"
    >
      {{ filter.label }}

smolinari

<template>
  <div style="width: 300px">
    <q-list bordered separator v-if="todos.length">
      <q-item v-for="todo in visibleTodos" :key="todo.id">
        <Todo :todo="todo" />
      </q-item>
    </q-list>
    <p v-else class="text-center"> Add some tasks and let's get some work done! </p>
  </div>
</template>

smolinari

<template>
  <ApolloQuery
    :query="gql => gql`
      query GetTodos {
        todos @client {
          id
          text
          completed
        }
      }

smolinari

<template>
  <div>
  <q-checkbox
    v-model="todoToggle"
    @input="setToggle"
  />
  <p v-if="error">There has been an error<br>{{error}}</p>
  </div>
</template>
<script>

smolinari

<template>
  <ApolloMutation
    :mutation="mutation"
    :update="updateCache"
  >
    <template v-slot="{ mutate, loading, error }">
      <q-checkbox
        v-model="todoToggle"
        @input="mutate"
      />

smolinari

<template>
...
</template>
<script>
...

  methods: {
    updateCache (store, { data: { toggleTodo } }) {
      const id = `TodoItem:${this.id}`
      const fragment = queries.toggleTodoFragment

smolinari

{
  "name": "quasar-todo-extension",
  "description": "A Quasar web browser extension for bookmarking and adding todos.",
  "version": "1.0.0",
  "manifest_version": 2,
  "icons": {
    "16": "icons/icon16x16.png",
    "48": "icons/icon48x48.png",
    "128": "icons/icon128x128.png"
  },

smolinari

export default function attachBackgroundHooks (bridge, allActiveConnections) {
  bridge.on('storage.get', event => {
    const payload = event.data
    if (payload.key === null) {
      chrome.storage.local.get(null, r => {
        const result = []

        // Group the items up into an array to take advantage of the bridge's chunk splitting.
        for (const itemKey in r) {
          result.push(r[itemKey])