fix: React-graphql using new api

decentralized-identity · Apr 16, 2020 · fe53366 · fe53366
1 parent 2a931ff
commit fe53366
Show file tree

Hide file tree

Showing 14 changed files with 194 additions and 320 deletions.
diff --git a/examples/react-graphql/client/src/components/ActivityItem/ActivityItem.tsx b/examples/react-graphql/client/src/components/ActivityItem/ActivityItem.tsx
@@ -19,7 +19,7 @@ interface Props {
   /**
    * The timestamp for when this message was recieved or sent
    */
-  date: number
+  date: string
   /**
    * The activity that is taking place
    */
@@ -33,22 +33,22 @@ interface Props {
   /**
    * The issuer of this message item
    */
-  sender: Types.Identity
+  from: Types.Identity
 
   /**
    * The subject
    */
   showRequest: () => void
-  receiver: Types.Identity
+  to: Types.Identity
   attachments: any
   renderAttachments?: (attachmentItem: any, itemIndex: number) => React.ReactNode
 }
 
 const Component: React.FC<Props> = ({
   attachments,
   renderAttachments,
-  sender,
-  receiver,
+  from,
+  to,
   type,
   showRequest,
   date,
@@ -60,23 +60,23 @@ const Component: React.FC<Props> = ({
         <Box ml={2}>
           {type == 'sdr' ? (
             <Text>
-              <b>{sender.shortId}</b> requested information from <b>you</b>
+              <b>{from.shortId}</b> requested information from <b>you</b>
             </Text>
           ) : type == 'w3c.vc' ? (
             <Text>
-              <b>{sender.did === receiver?.did ? 'You' : sender.shortId}</b> issued a credential to
-              <b> {receiver ? receiver.shortId : 'yourself'}</b>
+              <b>{from.did === to?.did ? 'You' : from.shortId}</b> issued a credential to
+              <b> {to ? to.shortId : 'yourself'}</b>
             </Text>
           ) : (
             <Text>
-              <b>You</b> shared credentials with <b>{receiver ? receiver.shortId : 'yourself'}</b>
+              <b>You</b> shared credentials with <b>{to ? to.shortId : 'yourself'}</b>
             </Text>
           )}
         </Box>
       </Box>
       <Box ml={2} flexDirection={'row'} display={'flex'} py={2}>
         <Icon name={'Alarm'} color={'#555555'} mr={2} />
-        <Text color={'#555555'}>{formatDistanceToNow(date) + ' ago'}</Text>
+        <Text color={'#555555'}>{formatDistanceToNow(Date.parse(date)) + ' ago'}</Text>
       </Box>
       {type == 'sdr' && (
         <Box p={3}>

diff --git a/examples/react-graphql/client/src/components/Credential/Credential.tsx b/examples/react-graphql/client/src/components/Credential/Credential.tsx
@@ -6,16 +6,16 @@ import './Credential.css'
 const S = require('sugar/string')
 
 interface Props {
-  iss: Types.Identity
-  sub: Types.Identity
+  issuer: Types.Identity
+  subject: Types.Identity
   onClick?: () => void
-  fields: Types.Field[]
+  claims: Types.Field[]
   detailMode?: Boolean
   jwt?: string
   selected?: boolean
 }
 
-const Component: React.FC<Props> = ({ onClick, detailMode, fields, jwt, iss, sub, selected }) => {
+const Component: React.FC<Props> = ({ onClick, detailMode, claims, jwt, issuer, subject, selected }) => {
   const detail = detailMode
     ? {}
     : { maxWidth: 350, style: { cursor: 'pointer' }, className: 'credential_hover' }
@@ -27,15 +27,15 @@ const Component: React.FC<Props> = ({ onClick, detailMode, fields, jwt, iss, sub
       <Box flexDirection={'row'} display={'flex'} alignItems={'center'}>
         <Avatar size={'40'} src={''} />
         <Box ml={2}>
-          <Text fontWeight={'bold'}>{iss.shortId}</Text>
+          <Text fontWeight={'bold'}>{issuer.shortId}</Text>
           <Box flexDirection={'row'} display={'flex'}>
             <Icon name={'PlayArrow'} />
-            <Text>{sub?.shortId}</Text>
+            <Text>{subject?.shortId}</Text>
           </Box>
         </Box>
       </Box>
       <Box mt={detailMode ? 30 : 16}>
-        {fields.map((field: any, i: number) => {
+        {claims.map((field: any, i: number) => {
           const fieldValueImage = !field.isObj
             ? field.value.endsWith('.jpg') || field.value.endsWith('.png')
             : false
@@ -56,7 +56,7 @@ const Component: React.FC<Props> = ({ onClick, detailMode, fields, jwt, iss, sub
             </Box>
           )
         })}
-        {!detailMode && fields.length > 2 && (
+        {!detailMode && claims.length > 2 && (
           <Box>
             <Text>...</Text>
           </Box>

diff --git a/examples/react-graphql/client/src/components/Request/Request.tsx b/examples/react-graphql/client/src/components/Request/Request.tsx
@@ -46,15 +46,15 @@ const Component: React.FC<Props> = ({ sdr, sender, receiver, threadId, close })
     setValid(valid)
   }
 
-  const [actionSendJwt] = useMutation(mutations.actionSendJwt, {
+  const [sendMessageDidCommAlpha1] = useMutation(mutations.sendMessageDidCommAlpha1, {
     refetchQueries: [
       {
         query: queries.allMessages,
         variables: { activeDid: appState.defaultDid },
       },
     ],
     onCompleted: response => {
-      if (response?.actionSendJwt?.id) {
+      if (response?.sendMessageDidCommAlpha1?.id) {
         updateSending(false)
         window.toastProvider.addMessage('Response sent!', { variant: 'success' })
         close()
@@ -69,11 +69,14 @@ const Component: React.FC<Props> = ({ sdr, sender, receiver, threadId, close })
       if (response.signPresentationJwt) {
         updateSending(true)
 
-        actionSendJwt({
+        sendMessageDidCommAlpha1({
           variables: {
-            to: sender.did,
-            from: appState.defaultDid,
-            jwt: response.signPresentationJwt.raw,
+            data: {
+              to: sender.did,
+              from: appState.defaultDid,
+              type: 'jwt',
+              body: response.signPresentationJwt.raw,
+            },
           },
         })
       }

diff --git a/examples/react-graphql/client/src/gql/mutations.ts b/examples/react-graphql/client/src/gql/mutations.ts
@@ -1,5 +1,13 @@
 import { gql } from 'apollo-boost'
 
+export const createIdentity = gql`
+  mutation createIdentity($type: String) {
+    createIdentity(type: $type) {
+      did
+    }
+  }
+`
+
 export const deleteIdentity = gql`
   mutation deleteIdentity($type: String, $did: String) {
     deleteIdentity(type: $type, did: $did)
@@ -27,18 +35,10 @@ export const signSdrJwt = gql`
     signSdrJwt(data: $data)
   }
 `
-export const actionSendJwt = gql`
-  mutation actionSendJwt($from: String!, $to: String!, $jwt: String!) {
-    actionSendJwt(from: $from, to: $to, jwt: $jwt) {
+export const sendMessageDidCommAlpha1 = gql`
+  mutation sendMessageDidCommAlpha1($data: SendMessageDidCommAlpha1Input!, $url: String) {
+    sendMessageDidCommAlpha1(data: $data, url: $url, save: true) {
       id
     }
   }
 `
-
-export const createIdentity = gql`
-  mutation createIdentity($type: String) {
-    createIdentity(type: $type) {
-      did
-    }
-  }
-`