peer-base / peer-pad

📝 Online editor providing collaborative editing in really real-time using CRDTs and IPFS.

PeerPad is a decentralized editor that allows concurrent writing of text. Besides making live changes to a given document, it allows read-only nodes to follow the changes in real-time. It also allows you to publish a self-contained snapshot of the document to IPFS.

Test it live at https://peerpad.net or https://ipfs.io/ipns/peerpad.net

Docs: Security, Technology

🔓 PeerPad is experimental software. It hasn't been audited, and as such shouldn't be used to create or share sensitive information.

Table of Contents

• Install
• Usage
• Build
• Testing
• Deploy
• Contribute
• License

Lead Maintainer

Jim Pick

Install

With the following installed:

• git
• node >= 8
• npm >= 6

Clone the repo and install the dependencies from npm.

git clone https://github.com/ipfs-shipyard/peer-pad.git
cd peer-pad
npm install

Usage

For local development with hot code reloading

npm start

Then open http://localhost:3000 in your browser.

Build

To build into the build dir, run:

npm run build

Testing

To run the unit tests:

npm test

To run the end-to-end smoke test that runs PeerPad in multiple, headless Chrome instances run:

npm run build
npm run test:e2e:ci

The e2e tests expect the site to already be running, so the test:e2e:ci will fire up an http-server before running the tests in test/e2e.

If you're running the dev server on the default port (via npm start) then you can run the e2e tests without starting a server with:

npm run test:e2e

By default the Chrome instances run headless, so you won't see the robots clicking around in the browser. To debug the tests and see what's going pass DEBUG=true as an env var.

DEBUG=true npm run test:e2e

To run the e2e test against a deployed version, just pass the url as an env var

URL=https://peerpad.net npm run test:e2e

To run the e2e load tests:

npm run test:e2e:load

Deploy

You can self-host your own PeerPad. For that, run npm run build and deploy the build directory to a web-server

See docs/DEPLOY.md more info on how PeerPad is deployed to https://peerpad.net

Some dependencies (like webcrypto) require that you're serving under HTTPS — unless it's localhost...

Contribute

The PeerPad is a work in progress. As such, there's a few things you can do right now to help out:

• Check out the existing issues!
• Perform code reviews. More eyes will help a) speed the project along b) ensure quality and c) reduce possible future bugs.
• Add tests. There can never be enough tests.

Read the PeerPad contributing.md for details on the latest development flow.

Want to hack on PeerPad?

License

MIT

peer-pad's Issues

creating document through URL

When creating a document through a URL, like this:

https://peerpad.io/#/mydocument

The user should be prompted whether they want to create a new document or access an already created one. In the last case, they get prompted to introduce read and write keys.

Editor style layout

Few things, looking at this screen shot:

• because we are already halving the screen I think it would be best if both views took as much space as possible not limiting the workspace to what usually is used for not split screen layout.
• the markdown overflows instead of wrapping

Browser: FF 56
Resolution: 1600x900

Snapshots URL ipfs.io

It would be better to use https://ipfs.io instead of gateway.ipfs.io for the snapshots URLs -- the latter only exists for historical reasons.

deploying peerpad

Deploying Peerpad should be done through our standard way of publish to IPFS and dnslink, the same way our websites get deployed (e.g https://github.com/ipfs/website#usage)

For that we need:

• Add peerpad.net to DNSSimple (@lgierth ?)
• @pgte to create a DNSSimple account so that we can share ownership with him
• Makefile with make build, make deploy and make publish-to-domain script

Move IPFS node status up and make writing area bigger

Disable non implemented UI elements

Such as:

and

Link to Github repo

Where can I get the code? How can I run it myself? How can I contribute?

redirect to HTTPS

If users go to http://peerpad.net it doesn't work.
Is it possible to redirect HTTP to HTTPS?

Enable options to encrypt snapshots

With #2, an option that can be added is a decrypt option, so that snapshots can be password encrypted when they are shared through IPFS.

Pad types

The supported text types should be:

Raw	Rendered
code	—
—	Richtext
Markdown	HTML

Shapshots should contain date

Also, please make the box bigger so that we can see the whole hash

Status message never changes to "online"

Possible cause: if IPFS is already online the started event will never be fired, and component state never updated

https://github.com/ipfs-shipyard/peerpad-core/blob/master/src/network.js#L10
https://github.com/ipfs-shipyard/peerpad/blob/master/src/components/Edit.js#L216

styling snapshot

Snapshot is unstyled. Use Peerpad look-and-feel around the text.

Domain: peerpad.net vs. peerpad.io

I registered both a while ago. The dotIO TLD has a really crappy track record of how they operate their DNS servers, so I'd be happy to not add more .io domains: https://hn.algolia.com/?query=io%20dns&sort=byDate&dateRange=all&type=story&prefix&page=0

I'd propose going with peerpad.net.

encrypt data at rest

Out of the box, Y.js uses the local store to store the CRDT, which means that records that contain parts of the content are stored unencrypted.

We should encrypt data at rest using a symmetric key derived from the "read key".

Request: more appropriate icons

The two icons make me think about adding a picture or adding a link, rather than taking a snapshot, can I request better icons?

OpenError: A mutation operation was attempted on a database that did not allow mutations

Using Firefox private browsing tab. Doesn't happen in Chrome.

snapshot scheme

Viewer is an external dependency, is a bundled JS in IPFS.
A snapshot is an IPFS UnixFS directory containing 2 files:

• index.html
• meta.json

index.html contains a script src to the viewer, served through IPFS gateway.
meta.json contains the following information:

{
  "encryptedTitle": "base64 string containing the encrypted title of the document",
  "encryptedDocument": "base64String containing the encrypted body of the document",
  "viewerVersion": "0.2"
}

Circle is hanging for me

Will need to try again later https://circleci.com/setup-project/gh/ipfs-shipyard/peerpad

Make Peerpad work fully offline

Towards getting Peerpad working offline, we do it in multiple of ways and two of which look more promissing. These are:

• a) Mount Peerpad over js-ipfs-api
  • Identify what things Peerpad uses (PubSub Room + Y.js connector) needs that js-ipfs-api needs to implement as well
  • Update the HTTP-API Spec to support those
  • Implement all the things
• b) Make an IPFS Node be a Signalling Endpoint for the WebRTC Transport
  • An IPFS node would have to implement either Relay or the Signalling Protocol
  • An IPFS node would have to implement the STUN protocol
  • A Peerpad instance would check if it was loaded from an IPFS node (by making an http request) and if yes, it would add a multiaddr to use that endpoint as a WebRTC Signalling endpoint.

prod build document viewer not bundling doc styles.

The build process is injecting the Doc css styles in dev, but no when built for prod deployment.

normalize.css

Error when building:

Module not found: Error: Can't resolve 'normalize.css' in '/Users/pedroteixeira/projects/ipfs/peerpad/peerpad/src/components'

Docs

I feel that docs are really important for this project and instead ARCHITECTURE.md and SECURITY.md should be available at the root repo and linked from the README too.

README.md should have a bold disclaimer that Peerpad hasn't been audited yet (add the open lock 🔓) and SECURITY.md should have that disclaimer as well.

Document architecture and security

File encryption.

The file upload feature should also encrypt the files, otherwise a file that is uploaded is stored on the network in plaintext. This creates the UX challenge that if a user grabs the hash of the file uploaded to the UI, it won't be able to be resolved. I think we can do something better.

What if when the user uploads a file, we upload a self decrypting image loader (that picks the key from the url, same as the pads), but if the image is being loaded from the pad itself, it knows how to pick the imagine from the graph and renders that accordingly? This way, when a user uploads a file, the graph would have a structure similar to:

Qmhashasdas
├── index.html  # page that knows how to decrypt the image with the key on the hash
├── file-uploaded
...

@pgte thoughts?

Debug screen

Love the debug screen feature from Etherpad on sandstorm:

This will be very helpful to get users to report errors to us.

homepage should have separate smaller bundle

For faster loading, the homepage JS bundle should not include all the app dependencies.

In order to shake big dependencies like js-ipfs, it would mean directly importing key and name-generating dependencies in core (something like require('peerpad-core/src/backend/keys/generate'), etc.).

Also, dynamic loading on the app would require having something like a "loading" screen while loading JS, before the app is fully funcional.

Unexpected local state causes editor rendering error

Works in Chrome

cursor position

Allow to know the cursor position for each peer, probably using a shared CRDT.

Snapshots should be self-contained and viewable through the gateways

A snapshot should pack the viewer and be retrievable by any IPFS node.

Snapshot urls must open in a new tab

Otherwise, there won't be a Node available to send the data to the gateways.

Also, Peerpad should do a .get request to the gateway so that the gateway starts caching the snapshot right away.

multiple tabs

When you have multiple tabs open, multiple IPFS nodes with the same id are opened, which causes havoc.

Agreed steps (with @diasdavid) to solve this:

• don't automatically start IPFS on boot
• if IPFS lock file is present, ask user to close tabs if they're opened, and opt to continue
• "continue" will start IPFS
• when closing the browser tab, close IPFS, which removes the file

homepage: new CRDT diagram

Invision has a new CRDT diagram that is more accurate (the one that is no longer 3D).

migrate to React

editing document title

Document title should not be related to document name (which is part of the URL and uniquely identifies the document across the entire network).

This has been poorly defined by me, and so far this hasn't had any support on peerpad-core.
@olizilla I'm thinking of adding a document.bindTitle(elem) where elem is a text field or text area. Is this ok?

The document title should be initialized to something like "Title here".

peer names

Allow giving names to nodes, prompting the user for the name.
Consider using a shared CRDT for this data.

Add gif to the README

Having a gif on the README of PeerPad doing its thing would be very enticing for new users.

Giphy has a great tool to create these: https://giphy.com/apps/giphycapture

Failed insecure connection to ws://star-signal.cloud.ipfs.team

I can't see why peerpad / ipfs-js is trying to to use the ws:// protocol to connect to star-signal.cloud.ipfs.team but in the browser console from

https://ipfs.io/ipfs/QmYD5hksXbSRRY4C3fFsneBuCqfcU8JS64wfLum896jFBc/#/w/markdown/7F6ctJK5wpcKhKNAbNMpH1/4XTTM4hvH1yP5sLm7gD1VkM2ovu9tey6AegEXS43KHSkKzGCd/K3TgUWpx1DQFJJnM3bUPf8urqqEV7SdXS6QdgWGCeAmyDb9v6NM3GZvzcWJ4uPqAbK26KZrpqEHfZFuvibU9HFmmMeZjJf71AmP21ZUZ9hV26KAtgJxnoQ4Z5BkFeMPJt17w4EzH

I can see:

Mixed Content: The page at 'https://ipfs.io/ipfs/QmYD5hksXbSRRY4C3fFsneBuCqfcU8JS64wfLum896jFBc/#/w/markdown/7F6ctJK5wpcKhKNAbNMpH1/4XTTM4hvH1yP5sLm7gD1VkM2ovu9tey6AegEXS43KHSkKzGCd/K3TgUWpx1DQFJJnM3bUPf8urqqEV7SdXS6QdgWGCeAmyDb9v6NM3GZvzcWJ4uPqAbK26KZrpqEHfZFuvibU9HFmmMeZjJf71AmP21ZUZ9hV26KAtgJxnoQ4Z5BkFeMPJt17w4EzH' was loaded over HTTPS, but attempted to connect to the insecure WebSocket endpoint 'ws://star-signal.cloud.ipfs.team/socket.io/?EIO=3&transport=websocket'. This request has been blocked; this endpoint must be available over WSS.

The initial page request is over https... and i can see the multiaddress in ipfs-js over here suggests wss...

https://github.com/ipfs/js-ipfs/blob/1e5dd2c091a101d1c9d6e6d66e6e527e662a79b8/src/core/runtime/config-browser.json#L4

@diasdavid @pgte can you help?

Homepage alpha warning should not be dismissible.

As per discussion with @diasdavid I'll remove the close button from the homepage alpha warning.

I'll leave the code to handle dismissing the warning in place, as it seems like something we'll want once we're less alpha-y.

Attack Vectors

Following our convo from last week, let's add a list of known attack vectors for Peerpad and how Peerpad mitigates them.

The list should include:

• Data Exfiltration
• Impersonation
• Taking control over a channel
• Pad collisions

Each attack vector should describe a potential scenario and how Peerpad mitigates it or will mitigate with a clear status of what was achieved so far.

Snapshots are not working

_backend.keys.generateSymmetrical is not a function

Use JWT

It would be interesting to use JWT instead of to share the keys. To continue sharing these keys through the url, we just need to serialize it and encode it.

Since JWT is valid JSON, we can transfer it as a dag-cbor node and then use the CID to base64 encode it ⚡️

Proposal for capability system

For each document:

• Shared CRDT of type map, containing, for each peer, their capabilities
• Capabilities can be, read, write and admin
• Only admins can change capabilities
• Nodes are identified by IPFS peerId (for now)
• Genesis: to prevent shadowing (an attack where a node introduces another node, pretending they're genesis), the channel name should contain a signature by the genesis node. (/cc @diasdavid )

Full screen flash

My developer mind says this is simply not possible, but both @olizilla and I have experienced full screen flashing (the whole screen, not just the browser) whilst leaving peerpad running in Chrome without refreshing the page on macOS. This only happens after say 5-10 mins after the page is loaded.

Is anyone else seeing this? Am I going completely mad? Could someone start peerpad, create a new document and leave the tab open in Chrome to see if this effects them also?

npm test yields Error: Error watching file for changes: EMFILE

→ npm test

> [email protected] test /Users/pedroteixeira/projects/ipfs/peerpad
> npm run lint && react-scripts test --env=jsdom


> [email protected] lint /Users/pedroteixeira/projects/ipfs/peerpad
> standard

2017-08-23 12:02 node[3967] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-08-23 12:02 node[3967] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
2017-08-23 12:02 node[3967] (FSEvents.framework) FSEventStreamStart: register_with_server: ERROR: f2d_register_rpc() => (null) (-22)
events.js:160
      throw er; // Unhandled 'error' event
      ^

Error: Error watching file for changes: EMFILE
    at exports._errnoException (util.js:1018:11)
    at FSEvent.FSWatcher._handle.onchange (fs.js:1420:11)
npm ERR! Test failed.  See above for more details.

Logo

Uploading logo for the README

Migrate from vanilla to React

Uncaught Error: no protocol with name: p2p-webrtc-star

Uncaught Error: no protocol with name: p2p-webrtc-star

Blank when opening from IPFS hash

See https://ipfs.io/ipfs/QmYqBG2aizE4cgrPSUwYHw2vL35F2GPLGpmdzgmnBZQEqH/

Feature request: comments

Peerpad is awesome! Is there a plan to integrate comments (a-la google docs?)?

It would be great if:

• users can assign themselves a temporary "nickname"
• users can select some part of text and write a comment
• users can reply to comments
• users can "resolve" comments