Merge pull request #60 from berty/wiki-input

feat: add article input to wikipedia tool
berty · Feb 16, 2022 · a071544 · a071544
2 parents 7f7ba2d + 88550b8
commit a071544
Show file tree

Hide file tree

Showing 6 changed files with 91 additions and 67 deletions.
diff --git a/Makefile b/Makefile
@@ -10,7 +10,7 @@ clean.gen:
 	; done
 	rm -f go/bind/labs/modules.go
 	rm -f rn/src/api/index.ts
-.PHONY: clean-gen
+.PHONY: clean.gen
 
 generate:
 	$(MAKE) -C rn node_modules/.mkt

diff --git a/go/pkg/blmod/blmod.go b/go/pkg/blmod/blmod.go
@@ -120,12 +120,14 @@ func (reg *Registry) Close() error {
 type UnimplementedModule struct {
 }
 
+var _ Module = (*UnimplementedModule)(nil)
+
 func (um *UnimplementedModule) Info() (*ModuleInfo, error) {
 	return nil, ErrNotImplemented
 }
 
-func (um *UnimplementedModule) Run(context.Context) ([]ModuleResult, error) {
-	return nil, ErrNotImplemented
+func (um *UnimplementedModule) Run(ctx context.Context, args []byte, mc ModuleContext) error {
+	return ErrNotImplemented
 }
 
 func (um *UnimplementedModule) Close() error {

diff --git a/rn/src/components/Card.tsx b/rn/src/components/Card.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useMemo } from 'react'
 import {
 	TouchableOpacity,
 	TouchableOpacityProps,
@@ -7,6 +7,10 @@ import {
 	ViewProps,
 	ActivityIndicator,
 	Pressable,
+	ViewStyle,
+	TextInput,
+	TextInputProps,
+	PressableProps,
 } from 'react-native'
 
 import { defaultColors } from '@berty-labs/styles'
@@ -75,3 +79,36 @@ export const LoaderCard: React.FC<
 		{children}
 	</Card>
 ))
+
+const rowStyle: ViewStyle = { flexDirection: 'row', alignItems: 'center' }
+
+export const TextInputCard: React.FC<
+	{
+		style?: ViewStyle
+		textSize?: number
+		onConfirm?: PressableProps['onPress']
+		confirmText?: string
+	} & Omit<TextInputProps, 'style'>
+> = React.memo(({ style, textSize = 20, onConfirm, confirmText = '➡️', ...props }) => {
+	const textInputStyle: ViewStyle = useMemo(
+		() => ({
+			color: defaultColors.text,
+			flex: 1,
+			fontSize: textSize,
+		}),
+		[textSize],
+	)
+	const textStyle = useMemo(() => ({ fontSize: textSize }), [textSize])
+	return (
+		<Card style={style}>
+			<View style={rowStyle}>
+				<TextInput style={textInputStyle} {...props} />
+				{typeof onConfirm === 'function' && (
+					<Pressable onPress={onConfirm}>
+						<Text style={textStyle}>{confirmText}</Text>
+					</Pressable>
+				)}
+			</View>
+		</Card>
+	)
+})
diff --git a/rn/src/screens/Browser.tsx b/rn/src/screens/Browser.tsx
@@ -1,40 +1,33 @@
 import React, { useState } from 'react'
-import { Pressable, Text, TextInput, TextInputProps, View } from 'react-native'
+import { Text, TextInputProps } from 'react-native'
 import WebView from 'react-native-webview'
 
 import { ScreenFC } from '@berty-labs/navigation'
-import { AppScreenContainer, Card, Loader, LoaderScreen } from '@berty-labs/components'
+import {
+	AppScreenContainer,
+	Card,
+	Loader,
+	LoaderScreen,
+	TextInputCard,
+} from '@berty-labs/components'
 import { useGomobileIPFS } from '@berty-labs/react-redux'
 import { defaultColors } from '@berty-labs/styles'
 
 const space = 15
 
-const URLInput: React.FC<Omit<TextInputProps, 'style'> & { onConfirm?: () => void }> = ({
-	onConfirm,
-	...props
-}) => {
-	const textSize = 20
+const URLInput: React.FC<
+	Omit<TextInputProps, 'style'> & {
+		onConfirm?: () => void
+	}
+> = props => {
 	return (
-		<>
-			<Card style={{ margin: space }}>
-				<View style={{ flexDirection: 'row', alignItems: 'center' }}>
-					<TextInput
-						style={{
-							color: defaultColors.text,
-							flex: 1,
-							fontSize: textSize,
-						}}
-						placeholder='Enter address...'
-						autoCapitalize='none'
-						autoCorrect={false}
-						{...props}
-					/>
-					<Pressable onPress={onConfirm}>
-						<Text style={{ fontSize: textSize }}>➡️</Text>
-					</Pressable>
-				</View>
-			</Card>
-		</>
+		<TextInputCard
+			placeholder='Enter address...'
+			autoCapitalize='none'
+			autoCorrect={false}
+			textSize={20}
+			{...props}
+		/>
 	)
 }
 

diff --git a/rn/src/screens/GoModule.tsx b/rn/src/screens/GoModule.tsx
@@ -1,9 +1,9 @@
 import React, { useCallback } from 'react'
-import { Pressable, ScrollView, Text, TextInput, View } from 'react-native'
+import { ScrollView, Text } from 'react-native'
 
 import { ScreenFC, useAppNavigation } from '@berty-labs/navigation'
 import { useAppDispatch, useAppSelector, useLabsModulesClient } from '@berty-labs/react-redux'
-import { AppScreenContainer, Card, LoaderCard } from '@berty-labs/components'
+import { AppScreenContainer, Card, LoaderCard, TextInputCard } from '@berty-labs/components'
 import { defaultColors } from '@berty-labs/styles'
 import { blmod } from '@berty-labs/api'
 import {
@@ -101,40 +101,21 @@ export const GoModule: ScreenFC<'GoModule'> = ({
 	return (
 		<AppScreenContainer>
 			<ScrollView style={{ margin: space }}>
-				{!running && (
-					<Card style={{ marginBottom: space }}>
-						<View style={{ flexDirection: 'row', alignItems: 'center' }}>
-							<TextInput
-								style={{
-									color: defaultColors.text,
-									flex: 1,
-									fontSize: textSize,
-									textAlignVertical: 'center',
-								}}
-								placeholder='Enter args...'
-								onChangeText={handleArgsChange}
-								value={args}
-							/>
-							<Pressable onPress={handleRun}>
-								<Text
-									style={{
-										fontSize: textSize,
-										textAlignVertical: 'center',
-									}}
-								>
-									🏃
-								</Text>
-							</Pressable>
-						</View>
-					</Card>
-				)}
-				{running && (
+				{running ? (
 					<LoaderCard
 						text='Running...'
 						style={{ marginBottom: space }}
 						size={textSize}
 						onCancel={handleCancel}
 					/>
+				) : (
+					<TextInputCard
+						placeholder='Enter args...'
+						onChangeText={handleArgsChange}
+						style={{ marginBottom: space }}
+						onConfirm={handleRun}
+						confirmText='🏃'
+					/>
 				)}
 				{!!(running || text) && (
 					<Card style={{ marginBottom: space }}>

diff --git a/rn/src/screens/Wikipedia.tsx b/rn/src/screens/Wikipedia.tsx
@@ -9,6 +9,7 @@ import {
 	LoaderCard,
 	LoaderScreen,
 	PressableCard,
+	TextInputCard,
 } from '@berty-labs/components'
 import { useGomobileIPFS } from '@berty-labs/react-redux'
 import { defaultColors } from '@berty-labs/styles'
@@ -38,21 +39,23 @@ const cardStyle = { marginTop: space, marginHorizontal: space }
 // - Allow to go up
 // - Allow to bookmark pages ? since no search could be really painful
 
+const ipn = '/ipns/en.wikipedia-on-ipfs.org'
+
 export const Wikipedia: ScreenFC<'Wikipedia'> = () => {
 	const mobileIPFS = useGomobileIPFS()
 	const [localError, setLocalError] = useState('')
 	const [loaded, setLoaded] = useState(false)
 	const [showResolveError, setShowResolveError] = useState(false)
+	const [inputArticle, setInputArticle] = useState('')
+	const [targetArticle, setTargetArticle] = useState('')
 	const [resolvedCID, loadedCID, resolveErr] = useAsyncTransform(
 		async (ac: AbortController) => {
 			if (!mobileIPFS.apiURL) {
 				return
 			}
 			setShowResolveError(true)
 			const reply = await fetch(
-				`${mobileIPFS.apiURL}/api/v0/resolve?arg=${encodeURIComponent(
-					'/ipns/en.wikipedia-on-ipfs.org',
-				)}`,
+				`${mobileIPFS.apiURL}/api/v0/resolve?arg=${encodeURIComponent(ipn)}`,
 				{
 					signal: ac.signal,
 					method: 'POST',
@@ -76,14 +79,23 @@ export const Wikipedia: ScreenFC<'Wikipedia'> = () => {
 
 	return (
 		<AppScreenContainer>
+			<TextInputCard
+				placeholder='Enter article name...'
+				style={cardStyle}
+				onChangeText={setInputArticle}
+				onConfirm={() => setTargetArticle(inputArticle)}
+			/>
 			{showResolveError && !!resolveErr && (
 				<PressableCard
 					title='Failed to resolve IPN'
 					style={cardStyle}
 					onPress={() => setShowResolveError(false)}
 				>
 					<Text style={{ color: defaultColors.text }}>
-						Using fallback from: {fallbackDate}
+						{ipn}
+						{'\n\n'}Using fallback from: {fallbackDate}
+						{'\n\n'}
+						{fallbackCID}
 						{'\n\n'}Tap to hide{`\n\n${resolveErr}`}
 					</Text>
 				</PressableCard>
@@ -97,15 +109,14 @@ export const Wikipedia: ScreenFC<'Wikipedia'> = () => {
 				<LoaderCard style={cardStyle} text='Resolving content identifier...' />
 			)}
 			{!loaded && <LoaderCard style={cardStyle} text='Loading page...' />}
-
 			<WebView
 				style={{
 					marginTop: space,
 					backgroundColor: defaultColors.background,
 					display: loaded ? undefined : 'none',
 				}}
 				source={{
-					uri: mobileIPFS.gatewayURL + cid,
+					uri: mobileIPFS.gatewayURL + cid + (targetArticle ? `/wiki/${targetArticle}` : ''),
 				}}
 				containerStyle={{ backgroundColor: defaultColors.background }}
 				renderError={err => (