diff --git a/api/Companies.ts b/api/Companies.ts index 1754b05..0f047d5 100644 --- a/api/Companies.ts +++ b/api/Companies.ts @@ -12,10 +12,52 @@ export enum Locations { Studiecentrum, E_huset, Kårhuset, - Tent, + X_Lab, Career_Room, } +export enum Competence{ + Architecture, + ArtificialIntelligence, + Usability, + Applications, + Automation, + Computation, + FireSafety, + ComputerSecurity, + Design, + EHealth, + Electronics, + EnergySystems, + Law, + Finance, + Geography, + Sustainability, + IndustrialProcesses, + Interactivity, + Chemistry, + Communications, + Construction, + FoodTechnology, + PharmaceuticalTechnology, + MathematicalModelling, + MaterialsEngineering, + LifeScience, + Mechatronics, + AccidentPrevention, + ProductDevelopment, + Programming, + Planning, + ProjectManagement, + RiskManagement, + TechnologyAndSociety, + CivilEngineering, + Simulations, + Manufacturing, + InterdisciplinaryCompetences, + Physics +} + export enum Position { Thesis, TraineeEmployment, @@ -63,6 +105,7 @@ export interface PublicCompanyDto { desiredProgramme: Programme[] | null; positions: Position[] | null; industries: Industry[] | null; + desiredCompetences: Competence[] | null; studentSessionMotivation: string | null; } diff --git a/components/HeaderStyles.ts b/components/HeaderStyles.ts index c54e28e..499dd81 100644 --- a/components/HeaderStyles.ts +++ b/components/HeaderStyles.ts @@ -10,4 +10,5 @@ export const HeaderStyles = { color: Colors.white, backgroundColor: Colors.arkadNavy, }, + headerTintColor: Colors.white, }; diff --git a/components/SearchBar.tsx b/components/SearchBar.tsx index 99fa493..122a999 100644 --- a/components/SearchBar.tsx +++ b/components/SearchBar.tsx @@ -2,12 +2,13 @@ import * as React from "react"; import { StyleSheet } from "react-native"; import Colors from "constants/Colors"; -import { Image, TextInputProps } from "react-native"; -import { TextInput } from "./TextInput"; +import { Image, TextInputProps, TextInput as TextInputNative} from "react-native"; +import { TextInputWithRef } from "./TextInput"; import { View } from "./Themed"; import { ArkadButton } from "./Buttons"; import { Entypo } from "@expo/vector-icons"; -import { useEffect, useState } from "react"; +import { forwardRef } from "react"; + export interface SearchBarProps extends TextInputProps { text: string, @@ -15,55 +16,46 @@ export interface SearchBarProps extends TextInputProps { toggleFilter: () => void, modalVisible: boolean, isFiltered: boolean, - placeHolder: string, } -export function SearchBar({text, onChangeText, toggleFilter, modalVisible, isFiltered, placeHolder}: SearchBarProps) { +export const SearchBar = forwardRef(({text, onChangeText, toggleFilter, modalVisible, isFiltered}, searchBarRef) => { const [focused, setFocused] = React.useState(false); - const [inputText, setInputText] = useState(text); - - useEffect(() => { - const handler = setTimeout(() => { - onChangeText(inputText); - }, 200); // some delay - - return () => { - clearTimeout(handler); - }; - }, [inputText, onChangeText]); return ( - - - setFocused(false)} - onFocus={() => setFocused(true)} - /> - - {!!inputText && ( - {setInputText("")}} > - - - )} + + + setFocused(false)} + onFocus={() => setFocused(true)} + ref={searchBarRef} + /> - toggleFilter()}> - {modalVisible ? ( - - ) : ( - + + {!!text && ( + {onChangeText("")}} > + + )} - {isFiltered && } - + + toggleFilter()}> + {modalVisible ? ( + + ) : ( + + )} + {isFiltered && } + + ); -} +}); const styles = StyleSheet.create({ searchContainer: { @@ -78,6 +70,7 @@ const styles = StyleSheet.create({ backgroundColor: Colors.white, borderWidth: 2, width: "100%", + }, searchIcon: { width: 24, @@ -94,6 +87,7 @@ const styles = StyleSheet.create({ flex: 1, borderWidth: 0, borderRadius: 0, + width: "100%", }, clearButton: { height: "100%", diff --git a/components/TextInput.tsx b/components/TextInput.tsx index d0c40f2..fcf6b15 100644 --- a/components/TextInput.tsx +++ b/components/TextInput.tsx @@ -15,6 +15,18 @@ export function TextInput(props: TextInputProps) { ); } +export const TextInputWithRef = React.forwardRef((props, ref) => { + return ( + + ) +}) + const styles = StyleSheet.create({ input: { fontFamily: "main-font-bold", diff --git a/components/companies/CompaniesModal.tsx b/components/companies/CompaniesModal.tsx index e89fbee..d02bc28 100644 --- a/components/companies/CompaniesModal.tsx +++ b/components/companies/CompaniesModal.tsx @@ -1,30 +1,32 @@ import React, { useState } from "react"; import { StyleSheet, View } from "react-native"; -import { Industry, Locations, Position, PublicCompanyDto } from "api/Companies"; +import { Competence, Industry, Locations, Position, PublicCompanyDto } from "api/Companies"; import Colors from "constants/Colors"; import { ArkadButton } from "../Buttons"; import { ArkadText } from "../StyledText"; -import { Programme } from "api/Students"; -import { CategoriesDropdown } from "./CategoriesDroppdown"; -import { INDUSTRIES, LOCATIONS, POSITIONS, PROGRAMS } from "./DroppdownItems"; +import { CompanyCategoriesDropdown } from "./CompanyCategoriesDropdown"; +import { INDUSTRIES, LOCATIONS, POSITIONS, COMPETENCES } from "./DroppdownItems"; import { companyLocations } from "./CompanyLocationsMap"; +import CompanyListDivider from "./CompanyListDivider"; type CompaniesModalProps = { companies: PublicCompanyDto[]; + filteredCompanies: PublicCompanyDto[]; setFilteredCompanies: (value: PublicCompanyDto[]) => void; setIsFiltered: (value: boolean) => void; isVisable: boolean; }; export default function CompaniesModal({ - companies, - setFilteredCompanies, - setIsFiltered, - isVisable, -}: CompaniesModalProps) { + companies, + filteredCompanies, + setFilteredCompanies, + setIsFiltered, + isVisable, + }: CompaniesModalProps) { const [positions, setPositions] = useState(POSITIONS); const [industry, setIndustry] = useState(INDUSTRIES); - const [programmes, setProgrammes] = useState(PROGRAMS); + const [competences, setCompetences] = useState(COMPETENCES); const [location, setLocation] = useState(LOCATIONS); const [locationOpen, setLocationOpen] = useState(false); @@ -36,34 +38,35 @@ export default function CompaniesModal({ const [industryOpen, industrySetOpen] = useState(false); const [industryValue, industrySetValue] = useState([]); - const [programmeOpen, programmeSetOpen] = useState(false); - const [programmeValue, programmeSetValue] = useState([]); + const [competenceOpen, competenceSetOpen] = useState(false); + const [competenceValue, competenceSetValue] = useState([]); const setSetFilteredCompanies = () => { filterCompanies(); setIsFiltered( locationValue.length > 0 || - industryValue.length > 0 || - positionValue.length > 0 || - programmeValue.length > 0 + industryValue.length > 0 || + positionValue.length > 0 || + competenceValue.length > 0 ); }; function resetFilters() { positionSetValue([]); industrySetValue([]); - programmeSetValue([]); + competenceSetValue([]); setLocationValue([]); setFilteredCompanies(companies); } + function filterCompanies() { let filteredCompanies = companies; if (positionValue.length > 0) { filteredCompanies = filteredCompanies.filter((company) => company.positions ? company.positions.some((position) => - positionValue.includes(position) - ) + positionValue.includes(position) + ) : false ); } @@ -71,17 +74,17 @@ export default function CompaniesModal({ filteredCompanies = filteredCompanies.filter((company) => company.industries ? company.industries.some((industry) => - industryValue.includes(industry) - ) + industryValue.includes(industry) + ) : false ); } - if (programmeValue.length > 0) { + if (competenceValue.length > 0) { filteredCompanies = filteredCompanies.filter((company) => - company.desiredProgramme - ? company.desiredProgramme.some((programme) => - programmeValue.includes(programme) - ) + company.desiredCompetences + ? company.desiredCompetences.some((competence) => + competenceValue.includes(competence) + ) : false ); } @@ -93,27 +96,33 @@ export default function CompaniesModal({ } setFilteredCompanies(filteredCompanies); } + if (!isVisable) { return null; } + return ( - + company.desiredCompetences?.includes(value) ?? false} onChangeValue={setSetFilteredCompanies} categories={false} /> - + (company.positions?.includes(value) ?? false)} + filteredCompanies={filteredCompanies} onChangeValue={setSetFilteredCompanies} categories={false} /> - + (company.industries?.includes(value) ?? false)} + filteredCompanies={filteredCompanies} onChangeValue={setSetFilteredCompanies} categories={false} /> - + (locationValue.includes(companyLocations[company.id]) ?? false)} //Fixa! + filteredCompanies={filteredCompanies} onChangeValue={setSetFilteredCompanies} categories={false} /> + @@ -167,16 +185,15 @@ const styles = StyleSheet.create({ centeredView: { justifyContent: "flex-start", borderWidth: 0, - borderColor: Colors.lightGray, + borderColor: Colors.arkadTurkos, borderRadius: 15, - padding: 0, + padding: 16, margin: 0, - width: "90%", + width: "100%", }, modalView: { - marginBottom: 12, + justifyContent: "flex-start", borderRadius: 20, - padding: 0, alignItems: "center", }, footer: { @@ -184,6 +201,7 @@ const styles = StyleSheet.create({ flexDirection: "row", alignItems: "center", padding: 5, + paddingTop: 16, }, button: { margin: 0, diff --git a/components/companies/CompanyBadge.tsx b/components/companies/CompanyBadge.tsx new file mode 100644 index 0000000..a7a724a --- /dev/null +++ b/components/companies/CompanyBadge.tsx @@ -0,0 +1,36 @@ +import { Ionicons } from "@expo/vector-icons" +import Colors from "constants/Colors" +import { StyleSheet, TouchableOpacity, View, Text } from "react-native" +import { RenderBadgeItemPropsInterface } from "react-native-dropdown-picker" + +export function CompanyBadge ({label, value, onPress}: RenderBadgeItemPropsInterface) { + + return ( + onPress(value)}> + + {label} + + + + ) + +} + + +const styles = StyleSheet.create({ + badge: { + backgroundColor: Colors.arkadTurkos, + borderRadius: 20, + paddingHorizontal: 10, + paddingVertical: 5, + margin: 5, + flexDirection: "row", + alignItems: "center", + justifyContent: "center", + }, + badgeText: { + color: Colors.white, + fontSize: 14, + + } +}) \ No newline at end of file diff --git a/components/companies/CompanyCategoriesDropdown.tsx b/components/companies/CompanyCategoriesDropdown.tsx new file mode 100644 index 0000000..82bd2d5 --- /dev/null +++ b/components/companies/CompanyCategoriesDropdown.tsx @@ -0,0 +1,121 @@ +import { Entypo, Ionicons } from "@expo/vector-icons"; +import React from "react"; +import Colors from "constants/Colors"; +import { StyleSheet, View, Text, TouchableOpacity } from "react-native"; +import DropDownPicker, { ThemeNameType } from "react-native-dropdown-picker"; +import { PublicCompanyDto } from "api/Companies"; +import { CompanyBadge } from "./CompanyBadge"; + +type categoriesDropdownProps = { + open: boolean; + setOpen: (value: any) => void; + value: any; + setValue: (value: any) => void; + items: any; + setItems: (value: any) => void; + filterCompanies?: () => void; + filteredCompanies: PublicCompanyDto[]; + title: string; + itemFiltering: (company: PublicCompanyDto, value: any) => boolean; + onChangeValue?: () => void; + categories: boolean; + single?: boolean; +}; + +export function CompanyCategoriesDropdown(props: categoriesDropdownProps) { + const removeItem = (item: any) => { + props.setValue((prevItems: []) => prevItems.filter((i) => i !== item)); + }; + + + return ( + {}} + setOpen={props.setOpen} + setValue={props.setValue} + setItems={(value) => props.setItems(value)} + modalTitle={props.title} + modalTitleStyle={styles.modalTitle} + categorySelectable={!props.categories} + placeholderStyle={{ + color: Colors.white, + fontSize: 20, + fontFamily: "main-font-bold", + }} + selectedItemLabelStyle={{ + color: Colors.arkadTurkos, + }} + listItemContainerStyle={styles.listItemContainer} + listItemLabelStyle={styles.listItemLabel} + closeIconContainerStyle={styles.closeButton} + showArrowIcon={true} + ArrowDownIconComponent={({style}) => } + ArrowUpIconComponent={({style}) => } + mode="BADGE" + listMode="MODAL" + modalAnimationType="fade" + renderBadgeItem={(itemProps) => } + onClose={props.filterCompanies ? props.filterCompanies : () => {}} + CloseIconComponent={() => ( + + )} + TickIconComponent={() => ()} + + /> + ); +} +const styles = StyleSheet.create({ + modalTitle: { + fontWeight: "bold", + color: Colors.white, + fontFamily: "main-font-bold", + fontSize: 32, + }, + closeButton: { + backgroundColor: Colors.arkadGreen, + borderRadius: 48, + width: 48, + height: 48, + marginHorizontal: 6, + padding: 4, + margin: 0, + justifyContent: "center", + alignItems: "center", + }, + listItemContainer: { + borderColor: Colors.white, + borderLeftColor: Colors.arkadNavy, + borderRightColor: Colors.arkadNavy, + textShadowColor: Colors.white, + borderWidth: 0.5, + height: 60, + color: Colors.white, + }, + listItemLabel: { + color: Colors.white, + fontSize: 18, + }, + dropdown: { + color: Colors.white, + backgroundColor: "none", + borderWidth: 0, + height:60, + width: "100%", + margin: 0, + }, + checkmark: { + color: Colors.white, + fontSize: 32, + }, + tickIcon: { + color: Colors.arkadTurkos, + fontSize: 30, + }, +}); diff --git a/components/companies/CompanyDetailsHeader.tsx b/components/companies/CompanyDetailsHeader.tsx index 7a9cab8..094f468 100644 --- a/components/companies/CompanyDetailsHeader.tsx +++ b/components/companies/CompanyDetailsHeader.tsx @@ -28,7 +28,9 @@ const styles = StyleSheet.create({ container: { flexDirection: "row", alignItems: "center", + justifyContent: "flex-start", gap: 16, + flexGrow: 1, }, icon: { width: 42, diff --git a/components/companies/CompanyListDivider.tsx b/components/companies/CompanyListDivider.tsx index bde6b14..56de053 100644 --- a/components/companies/CompanyListDivider.tsx +++ b/components/companies/CompanyListDivider.tsx @@ -1,18 +1,19 @@ import { ArkadText } from "components/StyledText" import { View } from "components/Themed" import Colors from "constants/Colors"; -import { StyleSheet } from "react-native"; +import { Platform, StyleSheet, TextStyle, Text, ViewStyle } from "react-native"; type CompanyListDivider = { - text: string + text: string, + style?: ViewStyle, } -export default function CompanyListDivider({text}: CompanyListDivider) { +export default function CompanyListDivider({text, style}: CompanyListDivider) { return ( - - + + {text} ) @@ -22,7 +23,8 @@ export default function CompanyListDivider({text}: CompanyListDivider) { const styles = StyleSheet.create({ container: { - marginTop: 8, + backgroundColor: Colors.arkadNavy, + paddingTop: 8, flexDirection: "row", flex: 1, alignSelf: "stretch", @@ -33,6 +35,7 @@ const styles = StyleSheet.create({ text: { fontSize: 17, color: Colors.white, + height: 22, }, line: { height: 1, diff --git a/components/companies/CompanyLocationsMap.ts b/components/companies/CompanyLocationsMap.ts index 284da45..0bb5a7a 100644 --- a/components/companies/CompanyLocationsMap.ts +++ b/components/companies/CompanyLocationsMap.ts @@ -1,201 +1,175 @@ type MyMapLikeType = Record; //46 , 57, 63, 91, 105, 125, 126, 128, 145, export const companyLocations: MyMapLikeType = { - // key: company id, value: location enum - // Studiecentrum: 0 - // E-huset: 1 - // Kårhuset: 2 - // Tent: 3 - // Career Room: 4 - // 125 står ej på messsan - 4306: 3, - 4308: 2, - 4307: 0, - 4313: 0, - 4314: 0, - 4315: 3, - 4124: 1, - 4309: 2, - 4316: 3, - 4317: 0, - 4318: 3, - 4319: 0, - 4320: 0, - 4321: 2, - 4322: 0, - 4483: 3, - 4132: 1, - 4323: 3, - 4324: 1, - 4311: 0, - 4325: 0, - 4326: 1, - 4312: 0, - 4327: 3, - 4329: 2, - 4330: 1, - 4331: 0, - 4484: 3, - 4332: 0, - 4333: 1, - 4334: 0, - 4335: 0, - 4328: 2, - 4337: 0, - 4338: 0, - 4339: 3, - 4147: 1, - 4336: 1, - 4340: 3, - 4341: 1, - 4342: 1, - 4343: 0, - 4344: 1, - 4345: 0, - 4346: 3, - 4347: 3, - 4350: 3, - 4351: 1, - 4352: 2, - 4353: 0, - 4354: 0, - 4355: 2, - 4348: 3, - 4356: 3, - 4349: 0, - 4357: 0, - 4358: 0, - 4360: 1, - 4361: 0, - 4364: 0, - 4362: 1, - 4363: 3, - 4359: 2, - 4366: 3, - 4367: 0, - 4485: 3, - 4365: 2, - 4180: 0, - 4368: 2, - 4370: 0, - 4184: 0, - 4371: 2, - 4369: 3, - 4373: 2, - 4372: 3, - 4374: 0, - 4480: 0, - 4375: 2, - 4376: 3, - 4378: 0, - 4379: 0, - 4380: 1, - 4381: 3, - 4382: 2, - 4377: 0, - 4384: 3, - 4383: 3, - 4385: 0, - 4386: 0, - 4387: 1, - 4388: 2, - 4389: 0, - 4393: 0, - 4394: 1, - 4391: 3, - 4390: 0, - 4392: 3, - 4395: 2, - 4396: 0, - 4399: 0, - 4397: 0, - 4400: 1, - 4398: 0, - 4401: 3, - 4402: 3, - 4403: 0, - 4406: 0, - 4221: 1, - 4407: 1, - 4404: 3, - 4405: 2, - 4408: 2, - 4409: 0, - 4410: 3, - 4411: 3, - 4412: 0, - 4413: 2, - 4414: 3, - 4415: 2, - 4416: 2, - 4419: 1, - 4417: 1, - 4420: 0, - 4421: 0, - 4422: 0, - 4423: 3, - 4418: 0, - 4425: 0, - 4426: 0, - 4427: 0, - 4146: 0, - 4424: 0, - 4432: 0, - 4433: 3, - 4249: 3, - 4434: 2, - 4435: 2, - 4436: 2, - 4437: 3, - 4438: 2, - 4439: 0, - 4440: 1, - 4428: 1, - 4441: 0, - 4442: 1, - 4443: 2, - 4444: 2, - 4429: 0, - 4486: 1, - 4445: 0, - 4446: 1, - 4458: 0, - 4447: 1, - 4448: 1, - 4449: 1, - 4450: 1, - 4451: 0, - 4487: 0, - 4452: 0, - 4453: 3, - 4454: 1, - 4455: 1, - 4456: 0, - 4457: 0, - 4430: 0, - 4431: 2, - 4459: 1, - 4460: 3, - 4461: 3, - 4462: 1, - 4463: 2, - 4464: 0, - 4465: 0, - 4466: 0, - 4467: 2, - 4286: 0, - 4468: 1, - 4469: 0, - 4481: 3, - 4475: 2, - 4470: 0, - 4471: 3, - 4472: 2, - 4292: 1, - 4473: 0, - 4474: 2, - 4476: 0, - 4477: 3, - 4478: 1, - 4479: 0, + 4888:0, + 4827:0, + 4934:0, + 4806:0, + 4855:0, + 4637:0, + 4638:1, + 4917:0, + 4936:2, + 4929:0, + 4816:0, + 4817:2, + 4847:0, + 4931:2, + 4795:2, + 4913:0, + 4646:3, + 4812:0, + 4647:0, + 4648:0, + 4939:2, + 4900:3, + 4837:0, + 4796:0, + 4840:0, + 4830:2, + 4654:1, + 4901:1, + 4914:0, + 4850:2, + 4656:1, + 4828:0, + 4899:1, + 4821:1, + 4896:2, + 4918:0, + 4842:1, + 4928:1, + 4869:0, + 4858:0, + 4894:0, + 4887:3, + 4871:2, + 4844:0, + 4908:1, + 4943:2, + 4883:0, + 4911:0, + 4892:1, + 4873:0, + 4797:0, + 4890:0, + 4948:2, + 4684:1, + 4947:2, + 4876:0, + 4910:3, + 4879:2, + 4810:3, + 4836:1, + 4802:3, + 4950:0, + 4822:0, + 4799:1, + 4903:2, + 4884:3, + 4854:1, + 4825:0, + 4698:1, + 4860:0, + 4861:3, + 4805:0, + 4949:3, + 4851:0, + 4878:3, + 4815:0, + 4831:0, + 4882:0, + 4906:0, + 4852:1, + 4834:0, + 4926:2, + 4904:1, + 4863:0, + 4886:0, + 4874:0, + 4800:3, + 4880:3, + 4804:3, + 4905:2, + 4945:2, + 4813:0, + 4807:0, + 4722:1, + 4849:1, + 4845:2, + 4933:2, + 4902:3, + 4919:2, + 4727:0, + 4927:0, + 4829:1, + 4865:1, + 4897:1, + 4895:1, + 4920:2, + 4940:1, + 4867:3, + 4864:0, + 4820:0, + 4809:0, + 4889:2, + 4946:0, + 4937:1, + 4893:0, + 4857:0, + 4877:2, + 4826:0, + 4898:2, + 4912:0, + 4891:0, + 4923:0, + 4838:0, + 4811:2, + 4757:0, + 4853:1, + 4935:3, + 4907:1, + 4841:0, + 4922:0, + 4808:2, + 4846:1, + 4835:1, + 4916:1, + 4921:0, + 4925:0, + 4819:3, + 4881:0, + 4843:0, + 4801:1, + 4875:2, + 4866:0, + 4941:2, + 4872:0, + 4823:1, + 4832:0, + 4833:3, + 4798:0, + 4915:0, + 4862:1, + 4848:0, + 4824:1, + 4814:0, + 4777:0, + 4859:2, + 4938:2, + 4942:0, + 4779:2, + 4944:1, + 4868:2, + 4856:0, + 4930:0, + 4870:0, + 4924:1, + 4932:0, + 4839:2, + 4818:3, + 4803:0, + 4909:2, + 4885:0 }; + diff --git a/components/companies/DroppdownItems.ts b/components/companies/DroppdownItems.ts index 518fb91..fd51c06 100644 --- a/components/companies/DroppdownItems.ts +++ b/components/companies/DroppdownItems.ts @@ -1,4 +1,4 @@ -import { Industry, Locations, Position } from "api/Companies"; +import { Competence, Industry, Locations, Position } from "api/Companies"; import { Programme } from "api/Students"; export const POSITIONS = [ @@ -85,12 +85,55 @@ export const PROGRAMS = [ { label: "Risk, Safety and Crisis Management", value: Programme.Risk_Safety_and_Crisis_Management}, ]; +export const COMPETENCES = [ + { label: "Architecture", value: Competence.Architecture }, + { label: "Artificial Intelligence", value: Competence.ArtificialIntelligence }, + { label: "Usability", value: Competence.Usability }, + { label: "Applications", value: Competence.Applications }, + { label: "Automation", value: Competence.Automation }, + { label: "Computation", value: Competence.Computation }, + { label: "Fire Safety", value: Competence.FireSafety }, + { label: "Computer Security", value: Competence.ComputerSecurity }, + { label: "Design", value: Competence.Design }, + { label: "E-Health", value: Competence.EHealth }, + { label: "Electronics", value: Competence.Electronics }, + { label: "Energy Systems", value: Competence.EnergySystems }, + { label: "Law", value: Competence.Law }, + { label: "Finance", value: Competence.Finance }, + { label: "Geography", value: Competence.Geography }, + { label: "Sustainability", value: Competence.Sustainability }, + { label: "Industrial Processes", value: Competence.IndustrialProcesses }, + { label: "Interactivity", value: Competence.Interactivity }, + { label: "Chemistry", value: Competence.Chemistry }, + { label: "Communications", value: Competence.Communications }, + { label: "Construction", value: Competence.Construction }, + { label: "Food Technology", value: Competence.FoodTechnology }, + { label: "Pharmaceutical Technology", value: Competence.PharmaceuticalTechnology }, + { label: "Mathematical Modelling", value: Competence.MathematicalModelling }, + { label: "Materials Engineering", value: Competence.MaterialsEngineering }, + { label: "Life Science", value: Competence.LifeScience }, + { label: "Mechatronics", value: Competence.Mechatronics }, + { label: "Accident Prevention", value: Competence.AccidentPrevention }, + { label: "Product Development", value: Competence.ProductDevelopment }, + { label: "Programming", value: Competence.Programming }, + { label: "Planning", value: Competence.Planning }, + { label: "Project Management", value: Competence.ProjectManagement }, + { label: "Risk Management", value: Competence.RiskManagement }, + { label: "Technology and Society", value: Competence.TechnologyAndSociety }, + { label: "Civil Engineering", value: Competence.CivilEngineering }, + { label: "Simulations", value: Competence.Simulations }, + { label: "Manufacturing", value: Competence.Manufacturing }, + { label: "Interdisciplinary Competences", value: Competence.InterdisciplinaryCompetences }, + { label: "Physics", value: Competence.Physics }, +]; + + export const LOCATIONS = [ { label: "Studiecentrum", value: Locations.Studiecentrum }, { label: "Kårhuset", value: Locations.Kårhuset }, { label: "E-Huset", value: Locations.E_huset }, - { label: "Tent", value: Locations.Tent }, + { label: "X-Lab", value: Locations.X_Lab }, ]; export const YEARS = [ diff --git a/components/companies/TagsList.tsx b/components/companies/TagsList.tsx index 5381396..b35f8b7 100644 --- a/components/companies/TagsList.tsx +++ b/components/companies/TagsList.tsx @@ -1,14 +1,17 @@ import React from "react"; import { StyleSheet, View } from "react-native"; -import { Industry, Position, PublicCompanyDto } from "api/Companies"; +import { Competence, Industry, Position, PublicCompanyDto } from "api/Companies"; import Colors from "constants/Colors"; import { ArkadText } from "../StyledText"; +import { Programme } from "api/Students"; export enum ShowOptions { All, Industries, - Positions + Positions, + DesiredCompetences, + DesiredProgrammes, } type TagsListProps = { @@ -24,6 +27,13 @@ export const TagsList = ({ company, showOptions }: TagsListProps) => { color: Colors.arkadOrange, }; }); + const allCompetences = company.desiredCompetences ?? []; + const competenceTags = allCompetences.map((competence: Competence) => { + return { + text: Competence[competence], + color: Colors.arkadOrange, + }; + }); const allPositions = company.positions ?? []; const positionTags = allPositions.map((position: Position) => { return { @@ -31,6 +41,13 @@ export const TagsList = ({ company, showOptions }: TagsListProps) => { color: Colors.arkadTurkos, }; }); + const allDesired = company.desiredProgramme ?? []; + const desiredTags = allDesired.map((desired: Programme) => { + return { + text: Programme[desired].replaceAll("_", " "), + color: Colors.arkadTurkos, + } + }); let allTags; @@ -43,6 +60,16 @@ export const TagsList = ({ company, showOptions }: TagsListProps) => { allTags = positionTags; break; } + case ShowOptions.DesiredProgrammes: { + allTags = desiredTags; + break; + } + case ShowOptions.DesiredCompetences:{ + allTags=competenceTags + break; + } + + default: { allTags = industryTags.concat(positionTags); break; @@ -56,7 +83,7 @@ export const TagsList = ({ company, showOptions }: TagsListProps) => { {allTags.map((item, index) => {return ( - + )})} @@ -78,12 +105,12 @@ const styles = StyleSheet.create({ item: { height: "auto", borderRadius: 20, - paddingVertical: 5, - paddingHorizontal: 10, - + paddingVertical: 7, + paddingHorizontal: 12, + }, text: { color: Colors.white, - fontSize: 18, + fontSize: 16, }, }); diff --git a/components/companies/filterCompanies.ts b/components/companies/filterCompanies.ts index 6908046..052ae33 100644 --- a/components/companies/filterCompanies.ts +++ b/components/companies/filterCompanies.ts @@ -1,38 +1,38 @@ import { PublicCompanyDto } from "api/Companies"; -import { INDUSTRIES, POSITIONS, PROGRAMS } from "components/companies/DroppdownItems"; - -export const filterData = (query: string, data: PublicCompanyDto[] | null,) => { - if (!query) return data; - - const querys = (query.split(/\s+/)) - .filter(str => str !== "") - .map(s => s.toLowerCase()); - - const matchSomeQuery = (str: string) => ( - querys.some(query => str.toLocaleLowerCase().includes(query)) - ) - - const filterCategories = (categorie: Array<{ label: string, value: number }>) => ( - categorie - .filter(({ label }) => (matchSomeQuery(label))) - .map(({ value }) => (value)) - ) - - const companyHasCategory = (company: Array | null, search: Array) => ( - company ? company.some(n => search.includes(n)) : false - ) - - const industriesSearch = filterCategories(INDUSTRIES) - const positionsSearch = filterCategories(POSITIONS) - const programsSearch = filterCategories(PROGRAMS) - - return (data ?? []).filter((company) => { - const companyMatch = matchSomeQuery(company.name) - - const industriesMatch = companyHasCategory(company.industries, industriesSearch) - const positionsMatch = companyHasCategory(company.positions, positionsSearch) - const programsMatch = companyHasCategory(company.desiredProgramme, programsSearch) - - return companyMatch || industriesMatch || positionsMatch || programsMatch - }); - }; \ No newline at end of file +import { INDUSTRIES, POSITIONS, COMPETENCES } from "components/companies/DroppdownItems"; + +export const filterData = (query: string, data: PublicCompanyDto[] | null) => { + if (!query) return data; + + const querys = (query.split(/\s+/)) + .filter(str => str !== "") + .map(s => s.toLowerCase()); + + const matchSomeQuery = (str: string) => ( + querys.some(query => str.toLocaleLowerCase().includes(query)) + ); + + const filterCategories = (category: Array<{ label: string, value: number }>) => ( + category + .filter(({ label }) => matchSomeQuery(label)) + .map(({ value }) => value) + ); + + const companyHasCategory = (company: Array | null, search: Array) => ( + company ? company.some(n => search.includes(n)) : false + ); + + const industriesSearch = filterCategories(INDUSTRIES); + const positionsSearch = filterCategories(POSITIONS); + const competencesSearch = filterCategories(COMPETENCES); + + return (data ?? []).filter((company) => { + const companyMatch = matchSomeQuery(company.name); + + const industriesMatch = companyHasCategory(company.industries, industriesSearch); + const positionsMatch = companyHasCategory(company.positions, positionsSearch); + const competencesMatch = companyHasCategory(company.desiredCompetences, competencesSearch); + + return companyMatch || industriesMatch || positionsMatch || competencesMatch; + }); +}; diff --git a/components/profileScreen/EditCompanyProfile.tsx b/components/profileScreen/EditCompanyProfile.tsx index 217fa98..66591ed 100644 --- a/components/profileScreen/EditCompanyProfile.tsx +++ b/components/profileScreen/EditCompanyProfile.tsx @@ -17,8 +17,8 @@ type EditCompanyProfileProps = { }; enum days { - day1 = "2023-11-14T00:00:00", - day2 = "2023-11-15T00:00:00", + day1 = "2024-11-12T00:00:00", + day2 = "2024-11-13T00:00:00", } export default function EditCompanyProfile({ diff --git a/components/profileScreen/EditUserProfile.tsx b/components/profileScreen/EditUserProfile.tsx index 62bc82e..57a022b 100644 --- a/components/profileScreen/EditUserProfile.tsx +++ b/components/profileScreen/EditUserProfile.tsx @@ -218,21 +218,6 @@ export default function EditUserProfile({ - - {hasProfilePicture ? ( - - ) : ( - - )} - - {hasProfilePicture && ( - - - - )} diff --git a/screens/companies/CompaniesScreen.tsx b/screens/companies/CompaniesScreen.tsx index e531007..a9606d0 100644 --- a/screens/companies/CompaniesScreen.tsx +++ b/screens/companies/CompaniesScreen.tsx @@ -3,6 +3,7 @@ import { Animated, LayoutAnimation, StyleSheet, + TextInput, } from "react-native"; import { StackNavigationProp } from "@react-navigation/stack"; import { View } from "components/Themed"; @@ -32,6 +33,8 @@ export default function CompaniesScreen({ navigation }: companiesNavigation) { const [modalVisible, setModalVisible] = useState(false); const [isFiltered, setIsFiltered] = useState(false); + const searchBarRef = useRef(null); + const animnationController = useRef(new Animated.Value(0)).current; const toggleFilter = () => { LayoutAnimation.configureNext(toggleAnimation); @@ -64,7 +67,7 @@ export default function CompaniesScreen({ navigation }: companiesNavigation) { }, []); useEffect(() => { - navigation.setOptions({headerTitle: () => ()}) + navigation.setOptions({headerTitle: () => ()}) }, [searchBarProps]); if (isLoading) { @@ -80,9 +83,10 @@ export default function CompaniesScreen({ navigation }: companiesNavigation) { setFilteredCompanies={setFilteredCompanies} setIsFiltered={setIsFiltered} isVisable={modalVisible} + filteredCompanies={filteredCompanies ?? []} /> - {if (modalVisible) {toggleFilter()}}} sortedCompanies={sortedCompanies} openCompanyDetails={openCompanyDetails}/> + {if (modalVisible) {toggleFilter()}; if (searchBarRef.current) {searchBarRef.current.blur()}}} sortedCompanies={sortedCompanies} openCompanyDetails={openCompanyDetails}/> ); diff --git a/screens/companies/CompanyDetailsScreen.tsx b/screens/companies/CompanyDetailsScreen.tsx index fa88b64..d74b796 100644 --- a/screens/companies/CompanyDetailsScreen.tsx +++ b/screens/companies/CompanyDetailsScreen.tsx @@ -12,6 +12,7 @@ import { EMap, TentMap, SCMap, KarhusetMap } from "components/maps/MapProps"; import { IconLinkButton } from "components/companies/IconLinkButton"; import { ShowOptions, TagsList } from "components/companies/TagsList"; import CompanyDetailsHeader from "components/companies/CompanyDetailsHeader"; +import { useSafeAreaInsets } from "react-native-safe-area-context"; type CompanyDetailsScreenParams = { route: { @@ -27,6 +28,7 @@ export default function CompanyDetailsScreen({ route, }: CompanyDetailsScreenParams) { const { id } = route.params; + const insets = useSafeAreaInsets(); const [company, setCompany] = useState(null); const [loading, setLoading] = useState(true); @@ -51,7 +53,9 @@ export default function CompanyDetailsScreen({ setLoading(true); const company = await API.companies.getCompany(id); + console.log(company) setCompany(company); + console.log(company); setLoading(false); }; @@ -64,12 +68,10 @@ export default function CompanyDetailsScreen({ const navigation = useNavigation(); - - useEffect(() => { navigation.setOptions({ headerStyle: { - backgroundColor: Colors.arkadNavy, + backgroundColor: Colors.arkadTurkos, }, headerBackground: () => ( ; } + return ( - - {setContentHeight(height); setScreenHeight(Dimensions.get('window').height)}} + + {setContentHeight(height); setScreenHeight(Dimensions.get('window').height)}} onScroll={Animated.event( [ { @@ -114,6 +119,8 @@ export default function CompanyDetailsScreen({ { useNativeDriver: true } )} scrollEventThrottle={16} + showsVerticalScrollIndicator={false} + showsHorizontalScrollIndicator={false} //Weird behavior with scrollbar on ios, disabled for now > @@ -182,24 +189,31 @@ export default function CompanyDetailsScreen({ + + + + + + + - ); } const styles = StyleSheet.create({ outerContainer: { flex: 1, + width: "100%", + height: "100%", backgroundColor: Colors.arkadNavy, }, colorBackgroundContainer: { flexDirection: "column", - overflow: "hidden", alignItems: "center", justifyContent: "flex-end", width: "100%", @@ -210,7 +224,7 @@ const styles = StyleSheet.create({ }, colorBackgroundRegular: { width: "100%", - height: "100%", + height: "300%", //Oversized to compensate if safeAreaInset top padding, could probably be better implemented but time crunch hehe backgroundColor: Colors.arkadTurkos, }, colorBackgroundGreenZone: { diff --git a/screens/maps/OnBoardingScreen.tsx b/screens/maps/OnBoardingScreen.tsx index 93c4380..37ceac0 100644 --- a/screens/maps/OnBoardingScreen.tsx +++ b/screens/maps/OnBoardingScreen.tsx @@ -23,7 +23,7 @@ const routingConfig: ReactRoutingConfig = { }; const indoorNavigationSDKConfig: ReactIndoorNavigationSDKConfig = { - apiKey: Constants.manifest?.extra?.apiKey, + apiKey: "848bb5dadbcba210e0ad", routingConfig: routingConfig, syncingInterval: sync, }; diff --git a/screens/maps/PositioningMapScreen.tsx b/screens/maps/PositioningMapScreen.tsx index f681735..66d44cf 100644 --- a/screens/maps/PositioningMapScreen.tsx +++ b/screens/maps/PositioningMapScreen.tsx @@ -272,7 +272,7 @@ export default function PositioningMapScreen({ route }: PositioningMapScreenProp setSdkInitialized(true); - await sdk?.getFeatureModelGraph(137521724).then(x => { + await sdk?.getFeatureModelGraph(137564108).then(x => { if(x!=null){ setFeatureModelNodes(x.filter(x => x.name !== "Footway" && x.name !== "Node")); } @@ -302,7 +302,7 @@ export default function PositioningMapScreen({ route }: PositioningMapScreenProp return ( { sdk ? ( - (lat === undefined || lng === undefined || featureModelNodes.length===0 ) ? ( + (lat === undefined || lng === undefined ) ? ( @@ -384,7 +384,7 @@ export default function PositioningMapScreen({ route }: PositioningMapScreenProp style={[ styles.floorButtonText, selectedFloor === floor && styles.selectedFloorText]}> - Floor {floor} + Floor {floor + 1 } ))} @@ -394,7 +394,7 @@ export default function PositioningMapScreen({ route }: PositioningMapScreenProp {location?.indoor && ( - {location.indoor?.buildingName} - Floor {location.indoor?.floorIndex} + {location.indoor?.buildingName} - Floor: {location.indoor?.floorIndex !== null && location.indoor?.floorIndex !== undefined ? location.indoor.floorIndex + 1 : ''} )} @@ -438,7 +438,7 @@ export default function PositioningMapScreen({ route }: PositioningMapScreenProp {selectedTarget && ( handleRoute(selectedTarget)} style={styles.routeButton}> - + )} @@ -526,6 +526,7 @@ const styles = StyleSheet.create({ marginLeft: 10, backgroundColor: Colors.arkadTurkos, padding: 5, + }, stopButtonText: { color: "white", diff --git a/screens/maps/components/RoutableTargetsModal.tsx b/screens/maps/components/RoutableTargetsModal.tsx index d78d135..73bb45e 100644 --- a/screens/maps/components/RoutableTargetsModal.tsx +++ b/screens/maps/components/RoutableTargetsModal.tsx @@ -75,17 +75,12 @@ const RoutableTargetsModal: React.FC = ({ items.forEach((item) => { const { target } = item; - if (target?.name.toLowerCase() === "lounge") { - loungeCategory.push(item); - } else { let firstLetter = target?.name[0]!.toUpperCase(); firstLetter = firstLetter?.replace(/\d/, "0-9"); - if (!result[firstLetter!]) { result[firstLetter!] = []; } result[firstLetter!].push(item); - } }); const groupedData = Object.entries(result) @@ -94,12 +89,7 @@ const RoutableTargetsModal: React.FC = ({ data, })) .sort((a, b) => a.title.localeCompare(b.title)); - if (loungeCategory.length > 0) { - groupedData.push({ - title: "Lounge", - data: loungeCategory, - }); - } + return groupedData; }; @@ -134,7 +124,7 @@ const RoutableTargetsModal: React.FC = ({ toggleFilter={toggleFilter} modalVisible={modalVisible} isFiltered={isFiltered} - placeHolder={" Search for targets..."}/> + /> {loading ? ( @@ -208,6 +198,8 @@ const styles = StyleSheet.create({ fontWeight: "700", color: Colors.white, padding: 8, + borderBottomWidth: 1, + borderBottomColor: Colors.arkadTurkos, }, list: { width: "100%",