diff --git a/src/pages/CreateSalary/CreateSalary.scss b/src/pages/CreateSalary/CreateSalary.scss
index 452d013..dd89210 100644
--- a/src/pages/CreateSalary/CreateSalary.scss
+++ b/src/pages/CreateSalary/CreateSalary.scss
@@ -35,6 +35,13 @@ ion-content {
margin: 0;
}
}
+ .input-options-list {
+ margin-top: 10px;
+ .input-options-list__item {
+ margin: 0 5px;
+ cursor: pointer;
+ }
+ }
}
}
}
diff --git a/src/pages/CreateSalary/CreateSalary.tsx b/src/pages/CreateSalary/CreateSalary.tsx
index 05cc0fc..337363a 100644
--- a/src/pages/CreateSalary/CreateSalary.tsx
+++ b/src/pages/CreateSalary/CreateSalary.tsx
@@ -16,6 +16,7 @@ import {
IonIcon,
IonButtons,
IonBackButton,
+ IonBadge,
} from '@ionic/react';
import { closeCircleOutline, arrowBack } from 'ionicons/icons';
@@ -38,11 +39,24 @@ const CreateSalary: React.FC = () => {
weeklyHours: 0,
});
const [technology, setTechnology] = useState('');
+ const [availablePositions, setAvailablePositions] = useState([
+ 'Developer',
+ 'QA',
+ ]);
const confirmSalary = () => {
console.log(formNewSalary);
};
+ const onCurrentPositionChange = (value: string) => {
+ // TODO: update list of available positions based on what the user typed
+ setAvailablePositions(['Scrum Master', 'CEO']);
+ setFormNewSalary({
+ ...formNewSalary,
+ position: value,
+ });
+ };
+
const addNewTechnology = () => {
if (!technology || formNewSalary.technologies.includes(technology)) return;
setFormNewSalary({
@@ -93,15 +107,27 @@ const CreateSalary: React.FC = () => {