Feat/user metadata upload endpoint #13

eduairet · 2023-01-25T06:30:44Z

Hey @jsanchez034 I merged main into this branch, now it works, what do you think about merging it (most of the things happen in the create-edit-user and don't affect the rest of the dapp), and keep going with a fresh restart with all the refactoring we discussed in the PR #11

- Now you can fill the form in usertest.js UI and create a JSON in IPFS

Links field fixed

- Contract interactions checked - Lens profile checked

Now you can create an user from the UI

Non connected behavior

Now the create/edit user for is finished Set profile with metadata still not working

New name: create-edit-user

- Added the iron session api route to the metadata upload endpoint

Inputs removed from globals and added to Form.module.css

- Now create profile works with variables - Missing ironOptions imported to endpoint

- Formik library and Yup implemented - Default profile query when user creates profile - Queries and mutations now work with variables - Reducer form replaced by formik

- Metadata structure is now right but the mutation is not working

Now the user settings are get from lens if they exist

- Proxy contract added - Edit user now works but it is sometimes underpriced

Discord as URL

- Create profile query typo fixed - Now you can access the create edit user window from the dashboard - Input undefined error fixed - Create edit user page now loads but needs a lot of debugging - Connect contract matches JP's but needs to allow the edit user function - Prettier and lint added to workflow

vercel · 2023-01-25T06:30:48Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
app-interplanetaryfonts	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Jan 25, 2023 at 6:36AM (UTC)

jsanchez034

This is awesome work Lalo! Thank you 😃

jsanchez034 · 2023-01-30T11:16:42Z

frontend/pages/create-edit-user.js

+ name: currentProfile.name,
+ ...Object.fromEntries(
+ currentProfile.attributes.map((field) => {
+ return [field.key, field?.value || ""];


Are you using field?.value here because field can be null?

Yeah, null or undefined so all the refs could start as string, I was getting a Some references started as undefined or something like that and this solved it, nevertheless I could find a better solution :)

jsanchez034 · 2023-01-30T11:24:30Z

frontend/pages/create-edit-user.js

+ email: body?.email,
+ name: body?.name,
+ website: body?.website,
+ bio: body?.bio,


Can body be null ( e.g. body? ) ? The yup validator library should take care of validating the form and not allowing this code to run no?

I think this approach was after starting everything as string and I didn't change it, I need to check that, thanks for pointing it JP :)

jsanchez034 · 2023-01-30T11:37:49Z

frontend/pages/create-edit-user.js

+ <>
+ <h6>{lensHandle ? `Welcome ${lensHandle}` : "Welcome"}</h6>
+ {createEditUserInputs.map((field) => {
+ if (!lensHandle && field.id === "handle") {


With this conditional are we saying to only render an input and error div combination of the the createEditUserInputs is the lens handle input? Should the conditional be field.id !== "handle" meaning all inputs besides the lens handle?

This part checks if the user has a lens profile, if is true loads all the data from that profile to the form, but this part needs to be taken from a global provider and not from this local approach, that's te main reason I want to leave this as it is temporarily, so I can still test with this frontend but start focusing on refactor and at some point come back here and chop the file, consume the global provider and make it more accessible to the user. Does that make sense?

Ah got ya 👍 I tested out the pages and looks like if you have a lens profile the welcome message above is the only thing that is rendered...

So I think this conditional should be the following to render the form inputs...

Suggested change

if (!lensHandle && field.id === "handle") {

if ((lensHandle && field.id !== "handle") || !lensHandle) {

In other words render every field except the handle field if the user has a lens profile or render all fields if a user does not have a lens handle. Also I think once we are out of the testing phase and ready to launch the mvp we can remove the code in this file around handling creating a lens user. What do you think about adding todo comments in this file that link to a new task in our trello board to make sure we cleanup that code?

jsanchez034 · 2023-01-30T11:41:56Z

frontend/components/UI/Form.js

@@ -0,0 +1,9 @@
+import classes from "../../styles/Form.module.css";


Not for this PR but when refactoring/cleaning up the code, what do you think about colocating the css module files with the components, example...

- frontend - components - UI - Form.js - Form.module.css

This will make it easier to navigate to the css module files to make changes

It makes sense, at the beginning it was simpler to manage the styles that way but as they increased everything got more complex haha

jsanchez034 · 2023-01-30T11:43:29Z

frontend/components/Profile/ProfileCard/ProfileData.js

@@ -29,7 +30,9 @@ export default function ProfileData(props) {
 {(props.user?.website ?? "").replace(/https?:\/\//, "")}
 </a>
 {props.connected && (
- <button className={classes.edit}>Edit Profile</button>
+ <Link className={classes.edit} href="/create-edit-user">


Nice job using Link from next here 🙌

jsanchez034 · 2023-01-30T11:47:21Z

frontend/pages/create-edit-user.js

@@ -0,0 +1,367 @@
+import React, { useState, useEffect } from "react";


Another note for the refactor/cleanup task, we should break out component, functions and constants from this file into smaller files we import into this one to reduce the size of this file

Completely agree :)

eduairet added 30 commits December 6, 2022 12:08

Endpoint created, testing pending

1abb814

Test profile successfully uploaded to IPFS

ff0b0d8

Merge branch 'master' into feat/user-metadata-upload-endpoint

b584390

Merge branch 'master' into feat/user-metadata-upload-endpoint

ba00710

Create User form started

d00ae68

Form now uploads data to IPFS

864ed2c

- Now you can fill the form in usertest.js UI and create a JSON in IPFS

Update usertest.js

49f6a52

Links field fixed

Update usertest.js

6db4767

- Contract interactions checked - Lens profile checked

Update usertest.js

0f7739e

Now you can create an user from the UI

Update usertest.js

1641bd5

Non connected behavior

Update usertest.js

567e329

Create Lens user with username

4e2a883

Links input handled

ede53b4

Now the create/edit user for is finished Set profile with metadata still not working

Page name changed

c1bf936

New name: create-edit-user

Merge branch 'master' into feat/user-metadata-upload-endpoint

3c386d9

Upload metadata endpoint secured

5249db2

- Added the iron session api route to the metadata upload endpoint

Input as a class

5f5d1ff

Inputs removed from globals and added to Form.module.css

Formik user form started

c204c27

Create profile

424ce38

- Now create profile works with variables - Missing ironOptions imported to endpoint

Formik implemented

09f178c

- Formik library and Yup implemented - Default profile query when user creates profile - Queries and mutations now work with variables - Reducer form replaced by formik

Logs cleaned, input name changed

a258db0

Metadata structure

4d5af03

- Metadata structure is now right but the mutation is not working

Form values are get from Lense

7b3c931

Now the user settings are get from lens if they exist

Edit user contract interaction added

3c29566

- Proxy contract added - Edit user now works but it is sometimes underpriced

Merge branch 'master' into feat/user-metadata-upload-endpoint

8d28919

Update pnpm-lock.yaml

327c0e3

Update create-edit-user.js

15992bf

Discord as URL

First try IPFS

c895ff4

Infura upload

e0c53ec

IPFS url to Lens

a932478

eduairet added 4 commits January 4, 2023 17:25

Update create-edit-user.js

35d37fa

Update create-edit-user.js

dfc8d39

Merge branch 'master' into feat/user-metadata-upload-endpoint

182d85b

eduairet requested a review from jsanchez034 January 25, 2023 06:30

eduairet added 2 commits January 25, 2023 00:34

Delete FontProjectV2.json

a9550a6

Delete test-user-profile-data.js

7ed9f64

vercel bot deployed to Preview January 25, 2023 06:36 View deployment

jsanchez034 reviewed Jan 30, 2023

View reviewed changes

hyperalchemy approved these changes Feb 17, 2023

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feat/user metadata upload endpoint #13

Feat/user metadata upload endpoint #13

eduairet commented Jan 25, 2023

vercel bot commented Jan 25, 2023 •

edited

jsanchez034 left a comment

jsanchez034 Jan 30, 2023

eduairet Jan 31, 2023

jsanchez034 Jan 30, 2023

eduairet Jan 31, 2023

jsanchez034 Jan 30, 2023

eduairet Jan 31, 2023

jsanchez034 Feb 3, 2023

jsanchez034 Jan 30, 2023

eduairet Jan 31, 2023

jsanchez034 Jan 30, 2023

jsanchez034 Jan 30, 2023

eduairet Jan 31, 2023

	if (!lensHandle && field.id === "handle") {
	if ((lensHandle && field.id !== "handle") \|\| !lensHandle) {

		@@ -0,0 +1,9 @@
		import classes from "../../styles/Form.module.css";

		@@ -0,0 +1,367 @@
		import React, { useState, useEffect } from "react";

Feat/user metadata upload endpoint #13

Are you sure you want to change the base?

Feat/user metadata upload endpoint #13

Conversation

eduairet commented Jan 25, 2023

vercel bot commented Jan 25, 2023 • edited

jsanchez034 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

vercel bot commented Jan 25, 2023 •

edited