nestiq-component-library 1.1.51 → 1.1.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -7,10 +7,11 @@ import "../MessagePopup/MessagePopUp.css";
7
7
  // import { showToast } from "nestiq-component-library";
8
8
 
9
9
  interface PopupProps {
10
- firstname: string;
10
+ firstname: string;
11
11
  lastname: string;
12
12
  handleSendMessage: any;
13
13
  onClick: any;
14
+ themesList:any;
14
15
  }
15
16
 
16
17
  export default function MessagePopUp(props:PopupProps) {
@@ -23,133 +24,129 @@ export default function MessagePopUp(props:PopupProps) {
23
24
  const [messageText, setMessageText] = useState("");
24
25
  const [firstName, setFirstName] = useState("");
25
26
  const [lastName, setLastName] = useState("");
26
- interface Theme {
27
- id: string;
28
- name: string;
29
- }
30
-
31
- const [themesList, setThemesList] = useState<Theme[]>([]);
32
27
 
33
28
  const handleClose = () => {
34
29
  props.onClick();
35
30
  };
31
+ const handleSendMessage = () => {
32
+ props.handleSendMessage();
33
+ }
36
34
  return (
37
35
  <div>
38
- <div className="popup-overlay">
39
- <div className="MessageShareSections d-flex flex-column col-10 col-lg-7">
40
- <img
41
- src={x}
42
- alt="close"
43
- className="closeIcon d-flex flex-column align-self-end"
44
- onClick={handleClose}
45
- />
46
- <div className="">
47
- <div className="d-flex ms-md-5 mb-4">
48
- <div className="circle align-self-center ms-md-2 me-4">
49
- <img
50
- src={mail_icon}
51
- alt="email"
52
- className="align-self-center"
53
- style={{
54
- alignSelf: "center",
55
- justifyContent: "center",
56
- margin: "14px",
57
- width: "25px",
58
- height: "20px",
59
- }}
60
- />
61
- </div>
62
- <div className="popUpHeader d-flex flex-column text-wrap mb-md-1 ">
63
- Nachricht senden {props.firstname}{" "}
64
- {props.lastname}
65
- </div>
36
+ <div className="popup-overlay">
37
+ <div className="MessageShareSections d-flex flex-column col-10 col-lg-7">
38
+ <img
39
+ src={x}
40
+ alt="close"
41
+ className="closeIcon d-flex flex-column align-self-end"
42
+ onClick={handleClose}
43
+ />
44
+ <div className="">
45
+ <div className="d-flex ms-md-5 mb-4">
46
+ <div className="circle align-self-center ms-md-2 me-4">
47
+ <img
48
+ src={mail_icon}
49
+ alt="email"
50
+ className="align-self-center"
51
+ style={{
52
+ alignSelf: "center",
53
+ justifyContent: "center",
54
+ margin: "14px",
55
+ width: "25px",
56
+ height: "20px",
57
+ }}
58
+ />
59
+ </div>
60
+ <div className="popUpHeader d-flex flex-column text-wrap mb-md-1 ">
61
+ Nachricht senden {props.firstname} {props.lastname}
66
62
  </div>
63
+ </div>
67
64
 
68
- <div className="d-flex flex-md-row flex-column ms-md-5 mt-md-0 ">
69
- <div className="d-flex flex-column mt-md-0 mt-4 col me-4 w-100 align-self-start justify-content-start">
70
- <span className="popup-tags mb-2">Betreff:*</span>
71
- <div>
72
- <select
73
- name="theme"
74
- id="theme"
75
- className="mb-md-4 col-md-11 col-12"
76
- style={{ height: "42px" }}
77
- value={themeId}
78
- onChange={(e) => setThemeId(e.target.value)}
79
- >
80
- <option value="">Select a theme</option>
81
- {themesList.map((theme) => (
82
- <option key={theme.id} value={theme.id}>
83
- {theme.name}
84
- </option>
85
- ))}
86
- </select>
87
- </div>
88
- </div>
89
- <div className="d-flex flex-column mt-md-4 col me-4 w-100">
90
- <div></div>
91
- <textarea
92
- className="popup_textarea col-12 col-md-10 mb-md-0 mt-2 "
93
- placeholder="Betreff deiner Nachricht"
65
+ <div className="d-flex flex-md-row flex-column ms-md-5 mt-md-0 ">
66
+ <div className="d-flex flex-column mt-md-0 mt-4 col me-4 w-100 align-self-start justify-content-start">
67
+ <span className="popup-tags mb-2">Betreff:*</span>
68
+ <div>
69
+ <select
70
+ name="theme"
71
+ id="theme"
72
+ className="mb-md-4 col-md-11 col-12"
94
73
  style={{ height: "42px" }}
95
- value={subject}
96
- onChange={(e) => setSubject(e.target.value)}
97
- />
74
+ value={themeId}
75
+ onChange={(e) => setThemeId(e.target.value)}
76
+ >
77
+ <option value="">Select a theme</option>
78
+ {props.themesList.map((theme: { id: string; name: string }) => (
79
+ <option key={theme.id} value={theme.id}>
80
+ {theme.name}
81
+ </option>
82
+ ))}
83
+ </select>
98
84
  </div>
99
85
  </div>
100
- <div className="d-flex flex-column col ms-md-5 me-md-4">
101
- <span className="popup-tags mb-2 ">Deine Nachricht:*</span>
86
+ <div className="d-flex flex-column mt-md-4 col me-4 w-100">
87
+ <div></div>
102
88
  <textarea
103
- className="popup_textarea mb-md-4 col-md-11 col-12 "
104
- placeholder="Deine Nachricht hier..."
105
- value={messageText}
106
- onChange={(e) => setMessageText(e.target.value)}
89
+ className="popup_textarea col-12 col-md-10 mb-md-0 mt-2 "
90
+ placeholder="Betreff deiner Nachricht"
91
+ style={{ height: "42px" }}
92
+ value={subject}
93
+ onChange={(e) => setSubject(e.target.value)}
107
94
  />
108
95
  </div>
109
- {/* <div className="d-flex flex-column ms-5 me-5">
96
+ </div>
97
+ <div className="d-flex flex-column col ms-md-5 me-md-4">
98
+ <span className="popup-tags mb-2 ">Deine Nachricht:*</span>
99
+ <textarea
100
+ className="popup_textarea mb-md-4 col-md-11 col-12 "
101
+ placeholder="Deine Nachricht hier..."
102
+ value={messageText}
103
+ onChange={(e) => setMessageText(e.target.value)}
104
+ />
105
+ </div>
106
+ {/* <div className="d-flex flex-column ms-5 me-5">
110
107
  <span className="popup-tags mb-2">Thema auswählen:*</span>
111
108
 
112
109
  </div> */}
113
- <div className="d-flex flex-md-row flex-column ms-md-5 ">
114
- <div className="d-flex flex-column col me-4 w-100">
115
- <span className="popup-tags mb-2">Vorname:</span>
116
- <input
117
- className="popup_textarea mb-md-4 col-12 col-md-11"
118
- placeholder="Dein Vorname"
119
- type="text"
120
- value={props?.firstname}
121
- onChange={(e) => setFirstName(e.target.value)}
122
- style={{ height: "42px" }}
123
- />
124
- </div>
125
- <div className="d-flex flex-column me-4 w-100 col ">
126
- <span className="popup-tags mb-2">Nachname:</span>
127
- <input
128
- className="popup_textarea col-12 mb-4 col-md-10"
129
- placeholder="Dein Nachname"
130
- type="text"
131
- value={lastName}
132
- onChange={(e) => setLastName(e.target.value)}
133
- style={{ height: "42px" }}
134
- />
135
- </div>
110
+ <div className="d-flex flex-md-row flex-column ms-md-5 ">
111
+ <div className="d-flex flex-column col me-4 w-100">
112
+ <span className="popup-tags mb-2">Vorname:</span>
113
+ <input
114
+ className="popup_textarea mb-md-4 col-12 col-md-11"
115
+ placeholder="Dein Vorname"
116
+ type="text"
117
+ value={props?.firstname}
118
+ onChange={(e) => setFirstName(e.target.value)}
119
+ style={{ height: "42px" }}
120
+ />
136
121
  </div>
137
- <div className="d-flex gap-md-3 gap-3 flex-md-row flex-column align-self-center justify-content-center mb-4 mt-md-2">
138
- <button
139
- className="main_button border-0 rounded-4 align-self-center "
140
- type="button"
141
- id="button"
142
- onClick={props.handleSendMessage}
143
- >
144
- <strong>Nachricht senden</strong>
145
- </button>
146
- <button className="button_icon-right border-1 col-sm-3 align-self-center">
147
- <strong>Abbrechen</strong>
148
- </button>
122
+ <div className="d-flex flex-column me-4 w-100 col ">
123
+ <span className="popup-tags mb-2">Nachname:</span>
124
+ <input
125
+ className="popup_textarea col-12 mb-4 col-md-10"
126
+ placeholder="Dein Nachname"
127
+ type="text"
128
+ value={lastName}
129
+ onChange={(e) => setLastName(e.target.value)}
130
+ style={{ height: "42px" }}
131
+ />
149
132
  </div>
150
133
  </div>
134
+ <div className="d-flex gap-md-3 gap-3 flex-md-row flex-column align-self-center justify-content-center mb-4 mt-md-2">
135
+ <button
136
+ className="main_button border-0 rounded-4 align-self-center "
137
+ type="button"
138
+ id="button"
139
+ onClick={handleSendMessage}
140
+ >
141
+ <strong>Nachricht senden</strong>
142
+ </button>
143
+ <button className="button_icon-right border-1 col-sm-3 align-self-center">
144
+ <strong>Abbrechen</strong>
145
+ </button>
146
+ </div>
151
147
  </div>
152
148
  </div>
149
+ </div>
153
150
  {/*
154
151
  {showSuccessPopUp && (
155
152
  <SuccessPopUp onClick={() => setShowSuccessPopUp(false)} />
@@ -46,6 +46,7 @@ interface PopupProps {
46
46
  handleSendMessage: any;
47
47
  firstname: any;
48
48
  lastname: any;
49
+ themesList: any;
49
50
  }
50
51
  export default function PropertyCard(props: PopupProps) {
51
52
  const [liked, setLiked] = useState(false);
@@ -283,6 +284,7 @@ export default function PropertyCard(props: PopupProps) {
283
284
  handleSendMessage={props.handleSendMessage}
284
285
  firstname={props.firstname}
285
286
  lastname={props.lastname}
287
+ themesList={props.themesList}
286
288
  />
287
289
  )}
288
290
  {sharePopUp && <SharePopup onClick={() => setSharePopUp(false)} />}