diff --git a/app/mobile/ios/Podfile.lock b/app/mobile/ios/Podfile.lock
index 51e6a7f9..c9f32630 100644
--- a/app/mobile/ios/Podfile.lock
+++ b/app/mobile/ios/Podfile.lock
@@ -336,8 +336,6 @@ PODS:
- React-Core
- react-native-document-picker (8.2.1):
- React-Core
- - react-native-floating-label-input (1.4.2):
- - React-Core
- react-native-image-resizer (3.0.5):
- React-Core
- react-native-keep-awake (1.2.0):
@@ -550,7 +548,6 @@ DEPENDENCIES:
- "react-native-blur (from `../node_modules/@react-native-community/blur`)"
- react-native-create-thumbnail (from `../node_modules/react-native-create-thumbnail`)
- react-native-document-picker (from `../node_modules/react-native-document-picker`)
- - react-native-floating-label-input (from `../node_modules/react-native-floating-label-input`)
- "react-native-image-resizer (from `../node_modules/@bam.tech/react-native-image-resizer`)"
- "react-native-keep-awake (from `../node_modules/@sayem314/react-native-keep-awake`)"
- react-native-receive-sharing-intent (from `../node_modules/react-native-receive-sharing-intent`)
@@ -656,8 +653,6 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-create-thumbnail"
react-native-document-picker:
:path: "../node_modules/react-native-document-picker"
- react-native-floating-label-input:
- :path: "../node_modules/react-native-floating-label-input"
react-native-image-resizer:
:path: "../node_modules/@bam.tech/react-native-image-resizer"
react-native-keep-awake:
@@ -771,7 +766,6 @@ SPEC CHECKSUMS:
react-native-blur: cfdad7b3c01d725ab62a8a729f42ea463998afa2
react-native-create-thumbnail: e022bcdcba8a0b4529a50d3fa1a832ec921be39d
react-native-document-picker: 69ca2094d8780cfc1e7e613894d15290fdc54bba
- react-native-floating-label-input: 70b2864337fa690c6d71d75dad66d8ec1d6bf162
react-native-image-resizer: 00ceb0e05586c7aadf061eea676957a6c2ec60fa
react-native-keep-awake: caee3ff89eaa21dfe29010f0d143566874a04441
react-native-receive-sharing-intent: 62ab28c50e6ae56d32b9e841d7452091312a0bc7
diff --git a/app/mobile/package.json b/app/mobile/package.json
index f9f65002..0150e718 100644
--- a/app/mobile/package.json
+++ b/app/mobile/package.json
@@ -33,7 +33,6 @@
"react-native-device-info": "^10.4.0",
"react-native-document-picker": "^8.1.3",
"react-native-fast-image": "^8.6.3",
- "react-native-floating-label-input": "^1.4.2",
"react-native-fs": "^2.20.0",
"react-native-gesture-handler": "^2.9.0",
"react-native-image-crop-picker": "^0.39.0",
diff --git a/app/mobile/src/session/profile/Profile.styled.js b/app/mobile/src/session/profile/Profile.styled.js
index 88cc2104..150ce2e3 100644
--- a/app/mobile/src/session/profile/Profile.styled.js
+++ b/app/mobile/src/session/profile/Profile.styled.js
@@ -196,12 +196,14 @@ export const styles = StyleSheet.create({
field: {
input: {
backgroundColor: Colors.inputBase,
- color: Colors.inputText,
borderRadius: 8,
minHeight: 48,
maxHeight: 128,
paddingLeft: 8,
},
+ inputText: {
+ color: Colors.inputText,
+ },
label: {
height: 16,
paddingLeft: 8,
@@ -217,27 +219,6 @@ export const styles = StyleSheet.create({
paddingTop: 8,
},
},
- floatingInput: {
- color: Colors.inputText,
- paddingTop: 20,
- paddingBottom: 4,
- },
- floatingLabel: {
- color: Colors.text,
- },
- floatingCustomLabel: {
- colorFocused: Colors.inputPlaceholder,
- colorBlurred: Colors.inputPlaceholder,
- fontSizeFocused: 12,
- },
- floatingContainer: {
- paddingHorizontal: 12,
- backgroundColor: Colors.inputBase,
- width: '100%',
- borderRadius: 8,
- minHeight: 48,
- maxHeight: 128,
- },
buttons: {
display: 'flex',
width: '100%',
diff --git a/app/mobile/src/session/settings/Settings.jsx b/app/mobile/src/session/settings/Settings.jsx
index f5770f38..782f0bd1 100644
--- a/app/mobile/src/session/settings/Settings.jsx
+++ b/app/mobile/src/session/settings/Settings.jsx
@@ -7,7 +7,7 @@ import { useSettings } from './useSettings.hook';
import MatIcons from 'react-native-vector-icons/MaterialCommunityIcons';
import Colors from 'constants/Colors';
import { BlurView } from "@react-native-community/blur";
-import { FloatingLabelInput } from 'react-native-floating-label-input';
+import { InputField } from 'utils/InputField';
import { Logo } from 'utils/Logo';
export function Settings() {
@@ -344,24 +344,14 @@ export function Settings() {
<>
{ state.strings.sealUnset }
-
- }
- customHidePasswordComponent={}
- />
-
+
{ state.sealPassword && (
sealAction(actions.generateKey)}>
@@ -380,24 +370,14 @@ export function Settings() {
<>
{ state.strings.sealLocked }
-
- }
- customHidePasswordComponent={}
- />
-
+
{ state.sealPassword && (
@@ -433,19 +413,13 @@ export function Settings() {
{ state.sealEnabled && state.sealRemove && (
<>
{ state.strings.sealDelete }
-
-
-
+
{ state.sealDelete === state.strings.deleteKey && (
sealAction(actions.removeKey)}>
{ state.strings.delete }
@@ -470,24 +444,14 @@ export function Settings() {
<>
{ state.strings.changePassword }
-
- }
- customHidePasswordComponent={}
- />
-
+
{ state.sealPassword && (
sealAction(actions.updateKey)}>
@@ -531,43 +495,26 @@ export function Settings() {
{ state.strings.changeMessage }
-
-
- onChangeText={actions.setUsername}
- />
-
+
-
- }
- customHidePasswordComponent={}
- />
-
{ state.validated && !state.available && (
{ state.strings.notAvailable }
@@ -609,19 +556,13 @@ export function Settings() {
{ state.strings.deleteAccount }
-
-
-
+
{ state.confirm === state.strings.deleteKey && (
diff --git a/app/mobile/src/session/settings/Settings.styled.js b/app/mobile/src/session/settings/Settings.styled.js
index 6c314d36..4eb03b35 100644
--- a/app/mobile/src/session/settings/Settings.styled.js
+++ b/app/mobile/src/session/settings/Settings.styled.js
@@ -369,6 +369,30 @@ export const styles = StyleSheet.create({
width: '100%',
height: 32,
},
-
+ field: {
+ input: {
+ backgroundColor: Colors.inputBase,
+ borderRadius: 8,
+ minHeight: 48,
+ maxHeight: 128,
+ },
+ inputText: {
+ color: Colors.inputText,
+ },
+ label: {
+ height: 16,
+ paddingLeft: 8,
+ },
+ labelText: {
+ color: Colors.inputPlaceholder,
+ fontSize: 12,
+ },
+ container: {
+ width: '100%',
+ paddingLeft: 16,
+ paddingRight: 16,
+ paddingTop: 8,
+ },
+ },
});
diff --git a/app/mobile/src/utils/InputField.jsx b/app/mobile/src/utils/InputField.jsx
index 68b8b87a..e711d5db 100644
--- a/app/mobile/src/utils/InputField.jsx
+++ b/app/mobile/src/utils/InputField.jsx
@@ -1,6 +1,10 @@
-import { TextInput, Text, View } from 'react-native';
+import { TextInput, Text, View, TouchableOpacity } from 'react-native';
+import { useState } from 'react';
+import MatIcons from 'react-native-vector-icons/MaterialCommunityIcons';
-export function InputField({ label, value, autoCapitalize, spellCheck, multiline, onChangeText, style }) {
+export function InputField({ label, value, secret, autoCapitalize, spellCheck, multiline, onChangeText, style }) {
+
+ const [hidden, setHidden] = useState(true);
return (
@@ -9,7 +13,23 @@ export function InputField({ label, value, autoCapitalize, spellCheck, multiline
{ label }
)}
-
+
+
+
+
+ { secret && !hidden && (
+ setHidden(true)}>
+
+
+ )}
+ { secret && hidden && (
+ setHidden(false)}>
+
+
+ )}
+
);
}
diff --git a/app/mobile/yarn.lock b/app/mobile/yarn.lock
index ebcaad5b..7ddce191 100644
--- a/app/mobile/yarn.lock
+++ b/app/mobile/yarn.lock
@@ -6501,11 +6501,6 @@ react-native-fast-image@^8.6.3:
resolved "https://registry.yarnpkg.com/react-native-fast-image/-/react-native-fast-image-8.6.3.tgz#6edc3f9190092a909d636d93eecbcc54a8822255"
integrity sha512-Sdw4ESidXCXOmQ9EcYguNY2swyoWmx53kym2zRsvi+VeFCHEdkO+WG1DK+6W81juot40bbfLNhkc63QnWtesNg==
-react-native-floating-label-input@^1.4.2:
- version "1.4.2"
- resolved "https://registry.yarnpkg.com/react-native-floating-label-input/-/react-native-floating-label-input-1.4.2.tgz#4db85aca6ef8509f0c4fb369b55b1fd1915ebe1e"
- integrity sha512-fHN+gQC+ghZgRuB+gJfNNo5IJRDy0grOia0gJpEmXbx9YqPud6nonQYunGWaHc9/b9GpL5n1q4VgWvZDTV+QLQ==
-
react-native-fs@^2.20.0:
version "2.20.0"
resolved "https://registry.yarnpkg.com/react-native-fs/-/react-native-fs-2.20.0.tgz#05a9362b473bfc0910772c0acbb73a78dbc810f6"