linked-data-browser 0.0.0

package/.ldo/profile.shapeTypes.ts

@@ -0,0 +1,71 @@
+import { ShapeType } from "@ldo/ldo";
+import { profileSchema } from "./profile.schema";
+import { profileContext } from "./profile.context";
+import {
+  SolidProfileShape,
+  AddressShape,
+  EmailShape,
+  PhoneNumberShape,
+  TrustedAppShape,
+  RSAPublicKeyShape,
+} from "./profile.typings";
+
+/**
+ * =============================================================================
+ * LDO ShapeTypes profile
+ * =============================================================================
+ */
+
+/**
+ * SolidProfileShape ShapeType
+ */
+export const SolidProfileShapeShapeType: ShapeType<SolidProfileShape> = {
+  schema: profileSchema,
+  shape: "https://shaperepo.com/schemas/solidProfile#SolidProfileShape",
+  context: profileContext,
+};
+
+/**
+ * AddressShape ShapeType
+ */
+export const AddressShapeShapeType: ShapeType<AddressShape> = {
+  schema: profileSchema,
+  shape: "https://shaperepo.com/schemas/solidProfile#AddressShape",
+  context: profileContext,
+};
+
+/**
+ * EmailShape ShapeType
+ */
+export const EmailShapeShapeType: ShapeType<EmailShape> = {
+  schema: profileSchema,
+  shape: "https://shaperepo.com/schemas/solidProfile#EmailShape",
+  context: profileContext,
+};
+
+/**
+ * PhoneNumberShape ShapeType
+ */
+export const PhoneNumberShapeShapeType: ShapeType<PhoneNumberShape> = {
+  schema: profileSchema,
+  shape: "https://shaperepo.com/schemas/solidProfile#PhoneNumberShape",
+  context: profileContext,
+};
+
+/**
+ * TrustedAppShape ShapeType
+ */
+export const TrustedAppShapeShapeType: ShapeType<TrustedAppShape> = {
+  schema: profileSchema,
+  shape: "https://shaperepo.com/schemas/solidProfile#TrustedAppShape",
+  context: profileContext,
+};
+
+/**
+ * RSAPublicKeyShape ShapeType
+ */
+export const RSAPublicKeyShapeShapeType: ShapeType<RSAPublicKeyShape> = {
+  schema: profileSchema,
+  shape: "https://shaperepo.com/schemas/solidProfile#RSAPublicKeyShape",
+  context: profileContext,
+};

package/.ldo/profile.typings.ts

@@ -0,0 +1,295 @@
+import { LdoJsonldContext, LdSet } from "@ldo/ldo";
+
+/**
+ * =============================================================================
+ * Typescript Typings for profile
+ * =============================================================================
+ */
+
+/**
+ * SolidProfileShape Type
+ */
+export interface SolidProfileShape {
+  "@id"?: string;
+  "@context"?: LdoJsonldContext;
+  /**
+   * Defines the node as a Person (from Schema.org) | Defines the node as a Person (from foaf)
+   */
+  type: LdSet<
+    | {
+        "@id": "Person";
+      }
+    | {
+        "@id": "Person2";
+      }
+  >;
+  /**
+   * The formatted name of a person. Example: John Smith
+   */
+  fn?: string;
+  /**
+   * An alternate way to define a person's name.
+   */
+  name?: string;
+  /**
+   * The person's street address.
+   */
+  hasAddress?: LdSet<AddressShape>;
+  /**
+   * The person's email.
+   */
+  hasEmail?: LdSet<EmailShape>;
+  /**
+   * A link to the person's photo
+   */
+  hasPhoto?: {
+    "@id": string;
+  };
+  /**
+   * Photo link but in string form
+   */
+  img?: string;
+  /**
+   * Person's telephone number
+   */
+  hasTelephone?: LdSet<PhoneNumberShape>;
+  /**
+   * An alternative way to define a person's telephone number using a string
+   */
+  phone?: string;
+  /**
+   * The name of the organization with which the person is affiliated
+   */
+  organizationName?: string;
+  /**
+   * The name of the person's role in their organization
+   */
+  role?: string;
+  /**
+   * A list of app origins that are trusted by this user
+   */
+  trustedApp?: LdSet<TrustedAppShape>;
+  /**
+   * A list of RSA public keys that are associated with private keys the user holds.
+   */
+  key?: LdSet<RSAPublicKeyShape>;
+  /**
+   * The user's LDP inbox to which apps can post notifications
+   */
+  inbox: {
+    "@id": string;
+  };
+  /**
+   * The user's preferences
+   */
+  preferencesFile?: {
+    "@id": string;
+  };
+  /**
+   * The location of a Solid storage server related to this WebId
+   */
+  storage?: LdSet<{
+    "@id": string;
+  }>;
+  /**
+   * The user's account
+   */
+  account?: {
+    "@id": string;
+  };
+  /**
+   * A registry of all types used on the user's Pod (for private access only)
+   */
+  privateTypeIndex?: LdSet<{
+    "@id": string;
+  }>;
+  /**
+   * A registry of all types used on the user's Pod (for public access)
+   */
+  publicTypeIndex?: LdSet<{
+    "@id": string;
+  }>;
+  /**
+   * A list of WebIds for all the people this user knows.
+   */
+  knows?: LdSet<{
+    "@id": string;
+  }>;
+}
+
+/**
+ * AddressShape Type
+ */
+export interface AddressShape {
+  "@id"?: string;
+  "@context"?: LdoJsonldContext;
+  /**
+   * The name of the user's country of residence
+   */
+  countryName?: string;
+  /**
+   * The name of the user's locality (City, Town etc.) of residence
+   */
+  locality?: string;
+  /**
+   * The user's postal code
+   */
+  postalCode?: string;
+  /**
+   * The name of the user's region (State, Province etc.) of residence
+   */
+  region?: string;
+  /**
+   * The user's street address
+   */
+  streetAddress?: string;
+}
+
+/**
+ * EmailShape Type
+ */
+export interface EmailShape {
+  "@id"?: string;
+  "@context"?: LdoJsonldContext;
+  /**
+   * The type of email.
+   */
+  type?:
+    | {
+        "@id": "Dom";
+      }
+    | {
+        "@id": "Home";
+      }
+    | {
+        "@id": "ISDN";
+      }
+    | {
+        "@id": "Internet";
+      }
+    | {
+        "@id": "Intl";
+      }
+    | {
+        "@id": "Label";
+      }
+    | {
+        "@id": "Parcel";
+      }
+    | {
+        "@id": "Postal";
+      }
+    | {
+        "@id": "Pref";
+      }
+    | {
+        "@id": "Work";
+      }
+    | {
+        "@id": "X400";
+      };
+  /**
+   * The value of an email as a mailto link (Example <mailto:jane@example.com>)
+   */
+  value: {
+    "@id": string;
+  };
+}
+
+/**
+ * PhoneNumberShape Type
+ */
+export interface PhoneNumberShape {
+  "@id"?: string;
+  "@context"?: LdoJsonldContext;
+  /**
+   * They type of Phone Number
+   */
+  type?:
+    | {
+        "@id": "Dom";
+      }
+    | {
+        "@id": "Home";
+      }
+    | {
+        "@id": "ISDN";
+      }
+    | {
+        "@id": "Internet";
+      }
+    | {
+        "@id": "Intl";
+      }
+    | {
+        "@id": "Label";
+      }
+    | {
+        "@id": "Parcel";
+      }
+    | {
+        "@id": "Postal";
+      }
+    | {
+        "@id": "Pref";
+      }
+    | {
+        "@id": "Work";
+      }
+    | {
+        "@id": "X400";
+      };
+  /**
+   * The value of a phone number as a tel link (Example <tel:555-555-5555>)
+   */
+  value: {
+    "@id": string;
+  };
+}
+
+/**
+ * TrustedAppShape Type
+ */
+export interface TrustedAppShape {
+  "@id"?: string;
+  "@context"?: LdoJsonldContext;
+  /**
+   * The level of access provided to this origin
+   */
+  mode: LdSet<
+    | {
+        "@id": "Append";
+      }
+    | {
+        "@id": "Control";
+      }
+    | {
+        "@id": "Read";
+      }
+    | {
+        "@id": "Write";
+      }
+  >;
+  /**
+   * The app origin the user trusts
+   */
+  origin: {
+    "@id": string;
+  };
+}
+
+/**
+ * RSAPublicKeyShape Type
+ */
+export interface RSAPublicKeyShape {
+  "@id"?: string;
+  "@context"?: LdoJsonldContext;
+  /**
+   * RSA Modulus
+   */
+  modulus: string;
+  /**
+   * RSA Exponent
+   */
+  exponent: number;
+}

package/.prettierignore

@@ -0,0 +1,6 @@
+node_modules
+android
+ios
+build
+dist
+coverage

package/.prettierrc

@@ -0,0 +1,10 @@
+{
+  "semi": true,
+  "singleQuote": true,
+  "trailingComma": "all",
+  "printWidth": 80,
+  "tabWidth": 2,
+  "bracketSpacing": true,
+  "jsxBracketSameLine": false,
+  "arrowParens": "always"
+}

package/.shapes/profile.shex

@@ -0,0 +1,121 @@
+PREFIX srs: <https://shaperepo.com/schemas/solidProfile#>
+PREFIX foaf: <http://xmlns.com/foaf/0.1/>
+PREFIX rdfs: <http://www.w3.org/2000/01/rdf-schema#>
+PREFIX schem: <http://schema.org/>
+PREFIX vcard: <http://www.w3.org/2006/vcard/ns#>
+PREFIX xsd: <http://www.w3.org/2001/XMLSchema#>
+PREFIX acl: <http://www.w3.org/ns/auth/acl#>
+PREFIX cert:  <http://www.w3.org/ns/auth/cert#>
+PREFIX ldp: <http://www.w3.org/ns/ldp#>
+PREFIX sp: <http://www.w3.org/ns/pim/space#>
+PREFIX solid: <http://www.w3.org/ns/solid/terms#>
+
+srs:SolidProfileShape EXTRA a {
+  a [ schem:Person ]
+    // rdfs:comment  "Defines the node as a Person (from Schema.org)" ;
+  a [ foaf:Person ]
+    // rdfs:comment  "Defines the node as a Person (from foaf)" ;
+  vcard:fn xsd:string ?
+    // rdfs:comment  "The formatted name of a person. Example: John Smith" ;
+  foaf:name xsd:string ?
+    // rdfs:comment  "An alternate way to define a person's name." ;
+  vcard:hasAddress @srs:AddressShape *
+    // rdfs:comment  "The person's street address." ;
+  vcard:hasEmail @srs:EmailShape *
+    // rdfs:comment  "The person's email." ;
+  vcard:hasPhoto IRI ?
+    // rdfs:comment  "A link to the person's photo" ;
+  foaf:img xsd:string ?
+    // rdfs:comment  "Photo link but in string form" ;
+  vcard:hasTelephone @srs:PhoneNumberShape *
+    // rdfs:comment  "Person's telephone number" ;
+  vcard:phone xsd:string ?
+    // rdfs:comment  "An alternative way to define a person's telephone number using a string" ;
+  vcard:organization-name xsd:string ?
+    // rdfs:comment  "The name of the organization with which the person is affiliated" ;
+  vcard:role xsd:string ?
+    // rdfs:comment  "The name of the person's role in their organization" ;
+  acl:trustedApp @srs:TrustedAppShape *
+    // rdfs:comment  "A list of app origins that are trusted by this user" ;
+  cert:key @srs:RSAPublicKeyShape *
+    // rdfs:comment  "A list of RSA public keys that are associated with private keys the user holds." ;
+  ldp:inbox IRI
+    // rdfs:comment  "The user's LDP inbox to which apps can post notifications" ;
+  sp:preferencesFile IRI ?
+    // rdfs:comment  "The user's preferences" ;
+  sp:storage IRI *
+    // rdfs:comment  "The location of a Solid storage server related to this WebId" ;
+  solid:account IRI ?
+    // rdfs:comment  "The user's account" ;
+  solid:privateTypeIndex IRI *
+    // rdfs:comment  "A registry of all types used on the user's Pod (for private access only)" ;
+  solid:publicTypeIndex IRI *
+    // rdfs:comment  "A registry of all types used on the user's Pod (for public access)" ;
+  foaf:knows IRI *
+    // rdfs:comment  "A list of WebIds for all the people this user knows." ;
+}
+
+srs:AddressShape {
+  vcard:country-name xsd:string ?
+    // rdfs:comment  "The name of the user's country of residence" ;
+  vcard:locality xsd:string ?
+    // rdfs:comment  "The name of the user's locality (City, Town etc.) of residence" ;
+  vcard:postal-code xsd:string ?
+    // rdfs:comment  "The user's postal code" ;
+  vcard:region xsd:string ?
+    // rdfs:comment  "The name of the user's region (State, Province etc.) of residence" ;
+  vcard:street-address xsd:string ?
+    // rdfs:comment  "The user's street address" ;
+}
+
+srs:EmailShape EXTRA a {
+  a [
+    vcard:Dom
+    vcard:Home
+    vcard:ISDN
+    vcard:Internet
+    vcard:Intl
+    vcard:Label
+    vcard:Parcel
+    vcard:Postal
+    vcard:Pref
+    vcard:Work
+    vcard:X400
+  ] ?
+    // rdfs:comment  "The type of email." ;
+  vcard:value IRI
+    // rdfs:comment  "The value of an email as a mailto link (Example <mailto:jane@example.com>)" ;
+}
+
+srs:PhoneNumberShape EXTRA a {
+  a [
+    vcard:Dom
+    vcard:Home
+    vcard:ISDN
+    vcard:Internet
+    vcard:Intl
+    vcard:Label
+    vcard:Parcel
+    vcard:Postal
+    vcard:Pref
+    vcard:Work
+    vcard:X400
+  ] ?
+    // rdfs:comment  "They type of Phone Number" ;
+  vcard:value IRI
+    // rdfs:comment  "The value of a phone number as a tel link (Example <tel:555-555-5555>)" ;
+}
+
+srs:TrustedAppShape {
+  acl:mode [acl:Append acl:Control acl:Read acl:Write] +
+    // rdfs:comment  "The level of access provided to this origin" ;
+  acl:origin IRI
+    // rdfs:comment "The app origin the user trusts"
+}
+
+srs:RSAPublicKeyShape {
+  cert:modulus xsd:string
+    // rdfs:comment  "RSA Modulus" ;
+  cert:exponent xsd:integer
+    // rdfs:comment  "RSA Exponent" ;
+}

package/README.md

@@ -0,0 +1,3 @@
+# Linked Data Browser (LDB)
+
+This codebase is for a data browser UI for Solid servers.

package/app/index.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import { DataBrowser } from '~/components/DataBrowser';
+import { Text } from '~/components/ui/text';
+import { RawCodeConfig } from '~/resourceViews/RawCode/RawCodeConfig';
+import { ContainerConfig } from '~/resourceViews/Container/ContainerConfig';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+import { StatusBar } from 'react-native';
+
+export function Screen() {
+  const mode = process.env.EXPO_PUBLIC_IS_SERVER_HOSTED
+    ? 'server-ui'
+    : 'standalone-app';
+
+  return (
+    <SafeAreaProvider>
+      <StatusBar />
+      <DataBrowser
+        views={[ContainerConfig, RawCodeConfig]}
+        mode={mode}
+        renderHomepage={() => <Text>Hopepage</Text>}
+        renderLogo={() => <Text>Logo</Text>}
+      />
+    </SafeAreaProvider>
+  );
+}

package/app.json

@@ -0,0 +1,37 @@
+{
+  "expo": {
+    "name": "linked-data-browser",
+    "slug": "linked-data-browser",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/images/icon.png",
+    "scheme": "myapp",
+    "userInterfaceStyle": "automatic",
+    "newArchEnabled": true,
+    "splash": {
+      "image": "./assets/images/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "assetBundlePatterns": [
+      "**/*"
+    ],
+    "ios": {
+      "supportsTablet": true
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/images/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      }
+    },
+    "web": {
+      "bundler": "metro",
+      "favicon": "./assets/images/favicon.png"
+    },
+    "plugins": [],
+    "experiments": {
+      "typedRoutes": true
+    }
+  }
+}

package/babel.config.js

@@ -0,0 +1,6 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: [['babel-preset-expo', { jsxImportSource: 'nativewind' }], 'nativewind/babel'],
+  };
+};

package/components/DataBrowser.tsx

@@ -0,0 +1,57 @@
+import { createContext, ReactNode, useContext, useMemo } from 'react';
+import { BrowserSolidLdoProvider } from '@ldo/solid-react';
+import React, { FunctionComponent } from 'react';
+import { Layout } from './nav/Layout';
+import { PortalHost } from '@rn-primitives/portal';
+import { TargetResourceProvider } from './TargetResourceProvider';
+import { ResourceViewConfig } from './ResourceView';
+import { NotifierWrapper } from 'react-native-notifier';
+import { Platform } from 'react-native';
+import { ThemeProvider } from '~/components/ThemeProvider';
+
+export interface DataBrowserConfig {
+  views: ResourceViewConfig[];
+  mode: 'standalone-app' | 'server-ui';
+  defaultIssuer?: string;
+  origin?: string;
+  renderHomepage?: () => ReactNode;
+  renderLogo?: () => ReactNode;
+}
+
+// @ts-ignore This will be filled in once the component mounts
+export const DataBrowserConfigContext = createContext<DataBrowserConfig>({});
+
+export function useDataBrowserConfig() {
+  return useContext(DataBrowserConfigContext);
+}
+
+export const DataBrowser: FunctionComponent<DataBrowserConfig> = (props) => {
+  const providerProps = useMemo<DataBrowserConfig>(() => {
+    return {
+      origin:
+        Platform.OS === 'web' && !props.origin
+          ? window.location.origin
+          : undefined,
+      defaultIssuer:
+        props.mode === 'server-ui'
+          ? window.location.origin
+          : 'https://solidcommunity.net',
+      ...props,
+    };
+  }, [props]);
+
+  return (
+    <ThemeProvider>
+      <BrowserSolidLdoProvider>
+        <NotifierWrapper>
+          <DataBrowserConfigContext.Provider value={providerProps}>
+            <TargetResourceProvider>
+              <Layout />
+              <PortalHost />
+            </TargetResourceProvider>
+          </DataBrowserConfigContext.Provider>
+        </NotifierWrapper>
+      </BrowserSolidLdoProvider>
+    </ThemeProvider>
+  );
+};

package/components/ResourceView.tsx

@@ -0,0 +1,14 @@
+import { SolidContainer, SolidLeaf } from '@ldo/connected-solid';
+import { LucideIcon } from 'lucide-react-native';
+import { ElementType } from 'react';
+
+export interface ResourceViewConfig {
+  name: string;
+  displayName: string;
+  displayIcon: LucideIcon;
+  view: ElementType;
+  canDisplay: (
+    targetUri: string,
+    targetResource: SolidLeaf | SolidContainer,
+  ) => boolean;
+}