feat: add module preamble

Signed-off-by: Norman Meier <[email protected]>

rn/html-mods/ipfs-upload-file/info.json

@@ -2,5 +2,6 @@
     "displayName": "IPFS File Upload",
     "shortDescription": "Upload a file to IPFS",
     "iconKind": 1,
-    "iconData": "4qyG77iP"
+    "iconData": "4qyG77iP",
+    "preamble": "Author: Harlan T Wood <[email protected]>\n\nhttps://github.com/ipfs-examples/js-ipfs-http-client-upload-file"
 }

rn/html-mods/ipns-publish/info.json

@@ -2,5 +2,6 @@
     "displayName": "IPNS Publish",
     "shortDescription": "Publish to IPNS using JS and Go",
     "iconKind": 1,
-    "iconData": "8J+TsA=="
+    "iconData": "8J+TsA==",
+    "preamble": "Author: Doug Anderson\n\nhttps://github.com/ipfs-examples/js-ipfs-browser-ipns-publish"
 }

rn/package.json

@@ -24,6 +24,7 @@
     "google-protobuf": "^3.19.4",
     "react": "17.0.2",
     "react-native": "0.67.2",
+    "react-native-hyperlink": "^0.0.19",
     "react-native-labs-bridge": "./react-native-labs-bridge",
     "react-native-safe-area-context": "^3.3.2",
     "react-native-screens": "^3.11.1",

rn/src/navigation/types.ts

@@ -11,10 +11,11 @@ export type ScreensParams = {
 	ArtCollection: undefined
 	NodeManager: undefined
 	NodeConfig: { name: string }
-	GoModule: { name: string; displayName: string }
+	GoModule: { name: string; displayName?: string; preamble?: string }
 	HTMLModule: {
 		name: string
 		displayName?: string
+		preamble?: string
 	}
 	IPFSLogs: undefined
 	Browser: undefined

rn/src/screens/GoModule.tsx

@@ -31,8 +31,8 @@ export const GoModule: ScreenFC<'GoModule'> = ({
 }) => {
 	const { setOptions } = useAppNavigation()
 	React.useEffect(() => {
-		setOptions({ title: displayName })
-	}, [setOptions, displayName])
+		setOptions({ title: displayName || name })
+	}, [setOptions, displayName, name])
 	const { state, text, error, args } = useAppSelector(state => selectModuleState(state, name))
 	const running = state === 'running'
 	const dispatch = useAppDispatch()

rn/src/screens/HTMLModule.tsx

@@ -1,27 +1,27 @@
 import React from 'react'
 import { Text } from 'react-native'
 import { WebView } from 'react-native-webview'
+import Hyperlink from 'react-native-hyperlink'
 
 import { ScreenFC, useAppNavigation } from '@berty-labs/navigation'
 import { defaultColors } from '@berty-labs/styles'
-import { AppScreenContainer, LoaderScreen } from '@berty-labs/components'
+import { AppScreenContainer, Card, LoaderScreen } from '@berty-labs/components'
 import { useGomobileIPFS } from '@berty-labs/react-redux'
 
+const space = 15
+
 export const HTMLModule: ScreenFC<'HTMLModule'> = ({
 	route: {
-		params: { name, displayName },
+		params: { name, displayName, preamble },
 	},
 }) => {
 	const nav = useAppNavigation()
 	const mobileIPFS = useGomobileIPFS()
 	const [localError, setLocalError] = React.useState<string>()
 
 	React.useEffect(() => {
-		if (!displayName) {
-			return
-		}
-		nav.setOptions({ title: displayName })
-	}, [nav, displayName])
+		nav.setOptions({ title: displayName || name })
+	}, [nav, displayName, name])
 
 	if (mobileIPFS.status !== 'up') {
 		return <LoaderScreen text='Waiting for IPFS node...' />
@@ -35,6 +35,15 @@ export const HTMLModule: ScreenFC<'HTMLModule'> = ({
 	}
 	return (
 		<AppScreenContainer>
+			{!!preamble && (
+				<Card style={{ marginBottom: space }}>
+					<Hyperlink linkDefault={true}>
+						<Text style={{ color: defaultColors.text }} selectable={true}>
+							{preamble.trim()}
+						</Text>
+					</Hyperlink>
+				</Card>
+			)}
 			<WebView
 				style={{ backgroundColor: defaultColors.background }}
 				source={{

rn/yarn.lock

@@ -6594,6 +6594,13 @@ lines-and-columns@^1.1.6:
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"
   integrity sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==
 
+linkify-it@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/linkify-it/-/linkify-it-2.2.0.tgz#e3b54697e78bf915c70a38acd78fd09e0058b1cf"
+  integrity sha512-GnAl/knGn+i1U/wjBz3akz2stz+HrHLsxMwHQGofCDfPvlf+gDKN58UtfmUquTY4/MXeE2x7k19KQmeoZi94Iw==
+  dependencies:
+    uc.micro "^1.0.1"
+
 locate-path@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-3.0.0.tgz#dbec3b3ab759758071b58fe59fc41871af21400e"
@@ -6809,6 +6816,11 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.14.tgz#7113fc4281917d63ce29b43446f701e68c25ba50"
   integrity sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==
 
+mdurl@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/mdurl/-/mdurl-1.0.1.tgz#fe85b2ec75a59037f2adfec100fd6c601761152e"
+  integrity sha1-/oWy7HWlkDfyrf7BAP1sYBdhFS4=
+
 merge-options@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/merge-options/-/merge-options-3.0.4.tgz#84709c2aa2a4b24c1981f66c179fe5565cc6dbb7"
@@ -8103,6 +8115,14 @@ react-native-codegen@^0.0.8:
     jscodeshift "^0.11.0"
     nullthrows "^1.1.1"
 
+react-native-hyperlink@^0.0.19:
+  version "0.0.19"
+  resolved "https://registry.yarnpkg.com/react-native-hyperlink/-/react-native-hyperlink-0.0.19.tgz#ca375cde1d244bb94c551736852ee0d688c8bb1f"
+  integrity sha512-x4wuRGDMnnpWcRr5MCK1D2UcEuzD9IHK8lfjEhO/+QqXNaX31HdeD3ss3BXXZgHxpRYtLbTB0TuFcl1HHANp3w==
+  dependencies:
+    linkify-it "^2.2.0"
+    mdurl "^1.0.0"
+
 react-native-labs-bridge@./react-native-labs-bridge:
   version "0.1.0"
 
@@ -9473,6 +9493,11 @@ ua-parser-js@^0.7.30:
   resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.31.tgz#649a656b191dffab4f21d5e053e27ca17cbff5c6"
   integrity sha512-qLK/Xe9E2uzmYI3qLeOmI0tEOt+TBBQyUIAh4aAgU05FVYzeZrKUdkAZfBNVGRaHVgV0TDkdEngJSw/SyQchkQ==
 
+uc.micro@^1.0.1:
+  version "1.0.6"
+  resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.6.tgz#9c411a802a409a91fc6cf74081baba34b24499ac"
+  integrity sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==
+
 uglify-es@^3.1.9:
   version "3.3.9"
   resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.3.9.tgz#0c1c4f0700bed8dbc124cdb304d2592ca203e677"