Fakultas Ilmu Komputer UI
Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
ppl-fasilkom-ui
PPL KI Ganjil 2021 2022
Clicks - Ecosystem Business
clicks-frontend
Commits
d99a6372
Commit
d99a6372
authored
Dec 03, 2021
by
angelin depthios
Committed by
Ahmad Izzudin Alifyandra
Dec 03, 2021
Browse files
feat : add Commenti nput
parent
57822efe
Changes
8
Hide whitespace changes
Inline
Side-by-side
src/components/Forms/IconForm.tsx
View file @
d99a6372
...
...
@@ -13,9 +13,8 @@ type props = {
placeholder
:
string
;
disabled
?:
boolean
;
iconType
?:
React
.
ComponentProps
<
typeof
MaterialIcons
>
[
"
name
"
];
password
?:
boolean
;
search
?:
boolean
;
errorMessage
?:
string
;
type
?:
"
password
"
|
"
search
"
|
"
comment
"
;
onPress
?:
()
=>
void
;
onEndEditing
?:
()
=>
void
;
};
...
...
@@ -27,14 +26,13 @@ const IconForm = ({
placeholder
,
disabled
=
false
,
iconType
,
password
=
false
,
search
=
false
,
type
,
errorMessage
,
onPress
,
onEndEditing
,
}:
props
)
=>
{
const
[
isFocused
,
setIsFocused
]
=
useState
(
false
);
const
[
showPass
,
setShowPass
]
=
useState
(
password
);
const
[
showPass
,
setShowPass
]
=
useState
(
true
);
const
[
isError
,
setIsError
]
=
useState
(
false
);
let
backgroundColor
:
string
;
...
...
@@ -58,7 +56,7 @@ const IconForm = ({
const
endEdit
=
()
=>
{
setIsFocused
(
false
);
if
(
search
||
disabled
)
{
if
(
type
===
"
search
"
||
disabled
)
{
setIsError
(
false
);
}
else
{
if
(
!
validateEmpty
(
text
))
{
...
...
@@ -71,9 +69,11 @@ const IconForm = ({
};
let
iconName
:
React
.
ComponentProps
<
typeof
MaterialIcons
>
[
"
name
"
];
if
(
search
)
{
if
(
type
===
"
search
"
)
{
iconName
=
"
search
"
;
}
else
if
(
password
)
{
}
else
if
(
type
===
"
comment
"
)
{
iconName
=
"
send
"
;
}
else
if
(
type
===
"
password
"
)
{
if
(
showPass
)
{
iconName
=
"
visibility
"
;
}
else
if
(
!
showPass
)
{
...
...
@@ -120,15 +120,15 @@ const IconForm = ({
editable
=
{
!
disabled
}
secureTextEntry
=
{
showPass
}
testID
=
"Input"
autoCapitalize
=
{
password
?
"
none
"
:
"
sentences
"
}
autoCapitalize
=
{
type
===
"
password
"
?
"
none
"
:
"
sentences
"
}
/>
</
View
>
<
TouchableOpacity
onPress
=
{
()
=>
password
&&
setShowPass
(
!
showPass
)
}
onPress
=
{
()
=>
type
===
"
password
"
&&
setShowPass
(
!
showPass
)
}
testID
=
"Touchable"
>
{
iconNam
e
===
"
search
"
&&
(
<
TouchableOpacity
onPress
=
{
()
=>
onPress
()
}
>
{
(
type
===
"
comment
"
||
typ
e
===
"
search
"
)
&&
(
<
TouchableOpacity
testID
=
"TouchableIcon"
onPress
=
{
()
=>
onPress
()
}
>
<
MaterialIcons
name
=
{
iconName
}
size
=
{
21
}
...
...
@@ -137,7 +137,7 @@ const IconForm = ({
/>
</
TouchableOpacity
>
)
}
{
iconNam
e
!
==
"
search
"
&&
(
{
!
(
type
===
"
comment
"
||
typ
e
=
==
"
search
"
)
&&
(
<
MaterialIcons
name
=
{
iconName
}
size
=
{
21
}
...
...
src/components/__tests__/Buttons/SmallButton.test.tsx
View file @
d99a6372
...
...
@@ -27,6 +27,12 @@ describe("Small Button Test", () => {
const
{
getByTestId
}
=
render
(<
SmallButtonWrapper
colors
=
"secondary"
/>);
expect
(
getByTestId
(
"
Text
"
)).
not
.
toBeNull
();
});
it
(
"
Should detect a disabled condition
"
,
()
=>
{
const
{
getByTestId
}
=
render
(
<
SmallButtonWrapper
colors
=
"primary"
disabled
=
{
true
}
/>
);
expect
(
getByTestId
(
"
Text
"
)).
not
.
toBeNull
();
});
it
(
"
Should detect an onPress function
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
SmallButtonWrapper
colors
=
"primary"
/>);
fireEvent
(
getByTestId
(
"
Touchable
"
),
"
onPress
"
);
...
...
src/components/__tests__/Forms/IconForm.test.tsx
View file @
d99a6372
...
...
@@ -40,8 +40,12 @@ describe("Icon Form Test", () => {
const
{
getByTestId
}
=
render
(<
IconFormWrapper
/>);
expect
(
getByTestId
(
"
Touchable
"
)).
not
.
toBeNull
();
});
it
(
"
Should detect a MaterialIcon
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
/>);
it
(
"
Should detect a MaterialIcon for password
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"password"
/>);
expect
(
getByTestId
(
"
MaterialIcon
"
)).
not
.
toBeNull
();
});
it
(
"
Should detect a MaterialIcon for search or comment
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"comment"
/>);
expect
(
getByTestId
(
"
MaterialIcon
"
)).
not
.
toBeNull
();
});
it
(
"
Should not detect a container title
"
,
()
=>
{
...
...
@@ -58,24 +62,24 @@ describe("Icon Form Test", () => {
expect
(
getByTestId
(
"
Input
"
).
props
.
value
).
toEqual
(
"
Hello
"
);
});
it
(
"
Should detect a password form
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
password
/>);
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"
password
"
/>);
expect
(
getByTestId
(
"
Icon
"
)).
not
.
toBeNull
();
});
it
(
"
Should detect a search form
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
search
/>);
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"
search
"
/>);
expect
(
getByTestId
(
"
Icon
"
)).
not
.
toBeNull
();
});
it
(
"
Should detect a disabled form
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
disabled
/>);
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"
disabled
"
/>);
expect
(
getByTestId
(
"
Icon
"
)).
not
.
toBeNull
();
});
it
(
"
Should detect a visible password form
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
password
/>);
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"
password
"
/>);
fireEvent
(
getByTestId
(
"
Touchable
"
),
"
onPress
"
);
expect
(
getByTestId
(
"
Icon
"
)).
not
.
toBeNull
();
});
it
(
"
Should not detect a visible password form
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
password
/>);
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"
password
"
/>);
fireEvent
(
getByTestId
(
"
Touchable
"
),
"
onPress
"
);
fireEvent
(
getByTestId
(
"
Touchable
"
),
"
onPress
"
);
expect
(
getByTestId
(
"
Icon
"
)).
not
.
toBeNull
();
...
...
@@ -103,7 +107,7 @@ describe("Icon Form Test", () => {
expect
(
getByTestId
(
"
Icon
"
)).
not
.
toBeNull
();
});
it
(
"
Should not detect an error on a search form
"
,
()
=>
{
const
{
getByTestId
}
=
render
(<
IconFormWrapper
search
/>);
const
{
getByTestId
}
=
render
(<
IconFormWrapper
type
=
"
search
"
/>);
fireEvent
(
getByTestId
(
"
Input
"
),
"
onEndEditing
"
);
expect
(
getByTestId
(
"
Icon
"
)).
not
.
toBeNull
();
});
...
...
src/components/button/SmallButton.tsx
View file @
d99a6372
...
...
@@ -6,8 +6,9 @@ type props = {
text
:
string
;
colors
:
string
;
onPress
:
()
=>
void
;
disabled
?:
boolean
;
};
const
SmallButton
=
({
text
,
colors
,
onPress
}:
props
)
=>
{
const
SmallButton
=
({
text
,
colors
,
onPress
,
disabled
}:
props
)
=>
{
return
(
<
TouchableOpacity
onPress
=
{
()
=>
onPress
()
}
...
...
@@ -16,10 +17,13 @@ const SmallButton = ({ text, colors, onPress }: props) => {
{
backgroundColor
:
colors
===
"
primary
"
?
Colors
.
button
.
primary
.
bg
?
disabled
?
"
rgba(7, 145, 249, 0.4)
"
:
Colors
.
button
.
primary
.
bg
:
Colors
.
button
.
warning
.
bg
,
},
]
}
disabled
=
{
disabled
}
testID
=
"Touchable"
>
<
Text
...
...
src/screens/auth/LoginScreen.tsx
View file @
d99a6372
...
...
@@ -55,7 +55,7 @@ const LoginScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
text
=
{
password
}
setText
=
{
setPassword
}
placeholder
=
{
"
Masukkan Password
"
}
password
type
=
"
password
"
errorMessage
=
{
"
Silahkan masukkan password
"
}
/>
</
View
>
...
...
src/screens/auth/RegisterScreen.tsx
View file @
d99a6372
...
...
@@ -119,7 +119,7 @@ const RegisterScreen = ({ navigation }: RootTabScreenProps<"TabOne">) => {
text
=
{
password
}
setText
=
{
setPassword
}
placeholder
=
{
"
Masukkan Password
"
}
password
type
=
"
password
"
errorMessage
=
{
"
Tolong masukkan password
"
}
/>
</
View
>
...
...
src/screens/ecosystem/CategoryEcosystemListScreen.tsx
View file @
d99a6372
...
...
@@ -80,7 +80,7 @@ const CategoryEcosystemListScreen = ({
text
=
{
search
}
setText
=
{
setSearch
}
placeholder
=
{
"
Cari di kategori ini
"
}
search
type
=
"
search
"
onPress
=
{
onSearch
}
onEndEditing
=
{
onSearch
}
/>
...
...
src/screens/ecosystem/EcosystemSearch.tsx
View file @
d99a6372
...
...
@@ -123,7 +123,7 @@ const EcosystemSearch = ({ route }: EcosystemStackScreenProps<"Search">) => {
text
=
{
search
}
setText
=
{
setSearch
}
placeholder
=
{
"
Cari dengan kata kunci ini..
"
}
search
type
=
"
search
"
onPress
=
{
onSearch
}
onEndEditing
=
{
onSearch
}
/>
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment