autarklabs / aragon-profile Goto Github PK

Implement a min/max height and overflow

We should create a new branch, and remove any webpack or rollup configs. Simply compile the code into ES5 and we'll let aragon client do the bundling

See designs

Right now the padding of all of the panels/boxes is 16px

Lets update to 20px

Call video: https://drive.google.com/drive/folders/1lSocjrj8K5MM-xoXuvaXx_61NcDd034v

Call notes (scattered):

Right now the way they do auth, sign a message for generating a main ID, and then sign a message for each space that you want to open

Doesn’t work for contract wallets

Two different keys for your contract wallets, then you want to enable both of those keys to enable your 3box

For each space that you add, you would need to double sign the first time to add that space

Have an iframe that lives account.3box.io - iframe stores the root seed and derives the key for the main identity and the seed for each space

Iframe has post message API to the app and this is handled by 3box

You want to open 3box, get an overlay over the webpage that says this app wants to get access to your 3box data. Authorize that or don’t authorize that

Should match single line input

http://localhost:3000/#/jonnnnnny/profile/ --> the viewMode calculation breaks here because it sees the / and then tries to read the eth address after that.

http://localhost:3000/#/jonnnnnny/profile/ should be the same as http://localhost:3000/#/jonnnnnny/profile

Something is wrong with it, not sure quite yet what's going on or where things broke

https://projects.invisionapp.com/d/?origin=v7#/console/17511474/363316804/preview

Not sure what this entails yet. Is this what A1 wants?

will need to sync up with arthur on this one after other tickets are finished. That's why it's an 8 pointer for now.

There is unnecessary whitespace in About region, below the Ethereum address. This is present when the work history has a bit of data.

This seems to be related to the new code that aimed to solve the grid issue:

Must:

• handle multiple react packages
• handle ipfs as a dependency (and libp2p) without timing out
• bundle 3box without installing all of their babel deps (this might be related to #2)
• work with npm link command for local development
• work with npm install @openworklabs/aragon-profile for production

I will be working with pierre from A1 on this later this week (hopefully)

Leaving room for general QA After integrating into the aragon client

This is a larger epic, that might encompass many future tickets (in the next grant cycle too). We're going to have to adjust the current profile UI to fit the design's A1 wants for profiles. Marking this epic to house future tickets related to this.

It should convert into single column much before this breakpoint

What breakpoints we using now?

The InformationCard component defines many other components within its own definition, such as PopoverCard.

I'd like to see these moved outside of the component definition, for two reasons:

1. Code maintainability: It makes it harder to read and understand this code, since these internal components may use the outer component's state/props in hard-to-see ways. It makes it harder to shrink this file by moving these related components to new ones. It clutters the mental model.
2. Performance: Every time the component is rendered, these related components get re-defined, rather than React being able to use a reference to the same component. This may cause performance issues if done excessively.

For now, we can at least move these definitions to the top level of the file, each receiving their own props rather than relying on InformationCard's props/state. If any of them seem like good candidates for moving to sibling files, that could be nice, too.

@chadoh this was assigned to you previously, but i updated the repo (and had to make a new issue). I think this is going to be pretty complicated, but it might be a good way to learn the code base. Happy to try and pair on this for a bit too.

It's something we could assign to radek too if you prefer

Currently there are technical limitations with regards to adding an organization to a user profile where the user can only add their current DAO as an "organization".

I'd like a document created in Notion that describes the following:

1. The current limitations
2. The enhancements required to support any organization being added
3. Whether the enhancements can be incorporated in our "Organization Settings" work (see the spec here: https://www.notion.so/autark/Organization-Settings-296282154d6848f0966c39c3b0762b9e)

Currently adding an organization requires its address, not name. Since web3 itself is not present, and not supposed to be present within apps, we need to discuss and decide what way is possible and the best.

The Profile app needs a hamburger menu that is conditionally displayed based on breakpoints, to be able to open up the left nav

The breakpoints should follow the standards set forth throughout Aragon.

Current:

This is to make sure the types we're expecting are the types we're getting from 3box. If a type is wrong, we should just set it as empty or something

implement #16

input:

output:

expect the output to look like the input

(should show no profile state) https://projects.invisionapp.com/d/?origin=v7#/console/17511474/363316804/preview

We can likely use the iframe component the aragon client already uses, and just adjust it to take another prop that will set the allow-same-origin header to be set in the iframe sandbox. This should be enough

DO NOT START until #2 and #3 are finished.

There should be a button, and when you click the button, the menu opens

right now the menu is also too transparent

Expected

Should be centered horizontally and vertically

Update the "You have no..." to 15px

Update the Ethereum address to 12px

For education and work history, the line height should be 1.8 and the font size should be
University name, company - 16px, bold
University degree, job role - 15px
Dates - 12px, normal
Job description - 14px, normal

The first step in merging our profiles with native aragon is to build in 3box identity resolution. We're still waiting on designs, and a better understanding of what it actually takes to pull this off + our responsibilities in that effort. Until then, we just have this epic.

aragon/client#854

After the profile save success or error, show the appropriate modal according to the design

1. react, react-dom, and styled-components should not be bundled into the published package. Since aragon client has these dependencies, it will create conflicts when two versions are used in the client repo (and hooks will break).

• Relevant issues: webpack/webpack#8607 webpack/webpack#8886
• I got this working in rollup, but can't seem to figure it out in webpack + npm link
• Does this require any changes in the aragon/aragon repo? I don't think it should...

2. Figure out why there are dependencies missing

• This is a question for 3box - for some reason you have to add 3box's babel deps in order to bundle their code. Still working on this one...

3. which bundler to use?

• Rollup was working for everything... Except bundling 3box. 3Box exports ES5 code but without bundling their packages. Their reasoning for this is to allow devs to have more flexibility on how 3box's deps get bundled (tree shaking). More on that here 3box/3box-js#408 (comment). Turns out this is (most likely) the underlying issue: ipfs/js-ipfs#1927
• I could get things to bundle when i hiked up the amount of memory available to the build process. However, then we'd have to change the build scripts in aragon/aragon in order to get this to work.
• Switched to webpack because it bundled 3box fine, but then of course ran into the issue with multiple reacts

This is just so we can get a version out the door without the organization feature and without a "coming soon" UI

This spins indefinitely, but doesn't happen all the time

@rkzel I'm concerned that the application errors take different shapes and forms. This ticket is to do a little chaos-monkey testing on profiles. Insert random errors in different parts of the app (just throw new Error() throughout different operations) and see how the app responds. We should make clear what an error is in the app and how we handle it. Are errors strings or objects?

Work and education history should be descending order based on End Date, with "Present" being at the top.

If two positions are "Present" or have the same date, do the 2nd rank based on descending order of the start date.

This relates to aragon/client#855, so track issue status there with respect to implementation