Implement SOLID

[vemonet]

• [x] Implement SOLID login
• [ ] Store user preferences to their SOLID pod (star shapes)
• [ ] Retrieve user preferences from their SOLID pod
• [ ] Enable user to choose to make their user preferences private (default) or public

Checkout the SOLID React SDK docs: https://docs.inrupt.com/developer-tools/javascript/react-sdk/

Seems only to be UI components to edit the SOLID user profile

Try: https://github.com/solid/react-components (and https://github.com/solid/query-ldflex)

solid.data['https://ruben.verborgh.org/profile/#me']['https://maastrichtu-ids.github.io/shapes-of-you#preferences'] = 1

Replace Like by Star? https://github.com/solid/react-components#-social-interactions

Use this URI to store preferences in SOLID pod: https://maastrichtu-ids.github.io/shapes-of-you#preferences

Example to create a custom Star button:

• https://github.com/solid/react-components/blob/master/src/components/LikeButton.jsx
• https://github.com/solid/react-components/blob/master/src/components/ActivityButton.jsx

star.tsx:

import { customActivityButton } from './ActivityButton';

/** Button to view and perform a "Star" action on an item. */
export default customActivityButton('ShapeStar', 'Star', 'You starred', 'Starred');

Then star it:

<Star object="https://shape-file-url">Star Icon</Star>

[vemonet]

Quickly implemented with built-in <Like> SOLID React component

It seems to require to have created a public folder in the pod: https://vemonet.solidcommunity.net/public/activities

Uncaught (in promise) Error: Could not retrieve https://vemonet.solidcommunity.net/public/activities (404: Not Found)

Also authorize the app to edit your SOLID pod in your SOLID pod profile: https://vemonet.solidcommunity.net/profile/card

In Edit your profile > Preferences tab

Edit Manage your trusted applications to add: https://maastrichtu-ids.github.io/shapes-of-you with Read, Write, Access and Control authorizations

Clicking on Like button showed this error at start:

PATCHhttps://vemonet.solidcommunity.net/public/activities
[HTTP/1.1 403 Origin Unauthorized 340ms]

@solid/react-components Error: Update query failed (403): Origin Unauthorized
    next SolidUpdateEngine.js:54
    processResults CreateActivityHandler.js:40
    handle ActivityHandler.js:66

Now, it shows this error:

@solid/react-components Error: Update query failed (500): Internal Server Error
    next SolidUpdateEngine.js:54
    processResults CreateActivityHandler.js:40
    handle ActivityHandler.js:66

[vemonet]

Currently adding data to a pod fails due to permissions issue. But the user name is properly retrieved, and displayed!

To give permissions to Shapes of you to add data to your pod:

• Go to your SOLID pod /public/activities folder
• Click on the lock icon 🔒
• Update permissions by adding the web app URL: https://index.semanticscience.org
  • You can also add the localhost URL for development: http://localhost:19006