GitHub attestation

src/components/AddAttestation.tsx

@@ -1,10 +1,11 @@
-import { useContext, useState } from 'react';
-import { createAttestation } from './request';
+import { Dispatch, SetStateAction, useContext, useState } from 'react';
+import { createAttestation, createTestAttestation } from './request';
 import Loading from './Loading';
 import StarterKitContext from '../context/starterKit';
 import GithubLoginButton from '../modules/Eas/Github/componens/LoginButton';
-import { useSession } from 'next-auth/react';
+import WakatimeButton from '../modules/Eas/Wakatime/WakatimeButton';
 import WorldCoin from '../pages/worldcoin';
+import { useSession } from 'next-auth/react';
 
 function AddAttestation(props: any) {
   const { user } = useContext(StarterKitContext);
@@ -48,6 +49,7 @@ function AddAttestation(props: any) {
     <>
       {loading && <Loading />}
       <p className={messageClass}>{message}</p>
+      {props.type === 'wakatime' && <WakatimeButton />}
       {props.type === 'github' && <GithubLoginButton />}
       {props.type === 'worldcoin' && <WorldCoin />}
       {props.type === 'github' && data && (
@@ -78,6 +80,20 @@ function AddAttestation(props: any) {
           </div>
         </>
       )}
+      {props.type === 'wakatime' && data && (
+        <>
+          <hr />
+          <div className='flex align-middle justify-center align-middle'>
+            <button
+              onClick={() => handleAttestationCreation}
+              className='mt-3 block text-blue-600 bg-red-50 hover:bg-redpraha hover:text-white rounded-xl px-5 py-2.5 text-center'
+              type='button'
+              data-modal-toggle='defaultModal'>
+              Create Attestation
+            </button>
+          </div>
+        </>
+      )}
     </>
   );
 }

src/components/Form/ProfileForm.tsx

@@ -16,6 +16,8 @@ import { useChainId } from '../../hooks/useChainId';
 import { useConfig } from '../../hooks/useConfig';
 import { QuestionMarkCircle } from 'heroicons-react';
 import AddAttestation from '../AddAttestation';
+import { useSession } from 'next-auth/react';
+import { createAttestation, createTestAttestation } from '../request';
 
 interface IFormValues {
   title?: string;
@@ -42,10 +44,28 @@ function ProfileForm({ callback }: { callback?: () => void }) {
   const { data: signer } = useSigner({
     chainId,
   });
+  const { data } = useSession();
+
+  const [wakatimeHandle, setWakatimeHandle] = useState<string | null>(null);
   const { isActiveDelegate } = useContext(StarterKitContext);
   const [activeLvlUpMenu, setActiveLvlUpMenu] = useState(0);
   const menuItems = [
-    { label: 'Github', content: <AddAttestation type='github' /> },
+    {
+      label: 'Github',
+      content: <AddAttestation props={{ sharedState: setWakatimeHandle, type: 'github' }} />,
+    },
+    {
+      label: 'WakaTime',
+      content: <AddAttestation props={{ sharedState: setWakatimeHandle, type: 'wakatime' }} />,
+    },
+    {
+      label: 'Upwork',
+      content: <AddAttestation props={{ sharedState: setWakatimeHandle, type: 'upwork' }} />,
+    },
+    {
+      label: 'Malt',
+      content: <AddAttestation props={{ sharedState: setWakatimeHandle, type: 'malt' }} />,
+    },
     { label: 'WorldCoin', content: <AddAttestation type='worldcoin' /> },
     { label: 'LinkedIn', content: <AddAttestation type='linkedIn' /> },
     { label: 'Upwork', content: <AddAttestation type='upwork' /> },

src/modules/Eas/Wakatime/WakatimeButton.tsx

@@ -0,0 +1,21 @@
+import { useSession, signIn, signOut } from 'next-auth/react';
+import { useState } from 'react';
+import Toggle from '../../../components/Toggle';
+
+export default function WakatimeButton() {
+  const { data: session } = useSession();
+  // TODO: load initial state from chain
+  const [wakatimeHandle, setWakatimeHandle] = useState(null);
+
+  return (
+    <>
+      <h2>Tell us your wakatime handle!</h2>
+      <input
+        type='text'
+        onChange={e => {
+          setWakatimeHandle(e.target.value);
+        }}
+      />
+    </>
+  );
+}

src/pages/api/eas/create-attestation.ts

@@ -13,7 +13,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
   console.log('accessToken', accessToken);
   console.log('userId', userId);
 
-  const langStats = getGithubLangStats(userId, accessToken);
+  const langStats = await getGithubLangStats(userId, accessToken);
 
   const githubdata = {
     languageStats: langStats,

src/pages/api/eas/create-test-attestation.ts

@@ -79,8 +79,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     const attestation = await getAttestation(uid);
     console.log('attestation', attestation);
 
-    res.status(200).json({ recipient: recipient });
-    res.status(200).json({ uid: uid });
+    res.status(200).json({ recipient: recipient, uid: uid });
   } catch (error) {
     console.error('errorDebug', error);
     res.status(500).json('certificate creation failed');