Fixed datepicer bug

src/__tests__/UITests/adsPageUI.test.js

@@ -43,7 +43,7 @@ describe("AdsPage render tests", () => {
           technologyType: "Backend",
           isChecked: false,
         },
-      ]);
+      ])
   });
 
   afterEach(() => {
@@ -130,7 +130,25 @@ describe("AdsPage render tests", () => {
 
       fireEvent.click(container.getByTestId("ad-filters-submit")[0]);
 
-      expect(container.getElementsByClassName("ad-card").length).toBeGreaterThan(0);
+      expect(
+        container.getElementsByClassName("ad-card").length
+      ).toBeGreaterThan(0);
     });
   });
+
+  it("Should render Ads", async () => {
+    const { container } = render(cont);
+    waitFor(() =>
+      expect(
+        container.getElementsByClassName("ad-card").length
+      ).toBeGreaterThan(0)
+    );
+  });
+
+  it("Should navigate to ad details when click on ad card", async () => {
+    const { container } = render(cont);
+    fireEvent.click(container.getElementsByClassName("ad-card")[0]);
+
+    expect(props.history.push).toHaveBeenCalledWith("/ads/1");
+  });
 });

src/assets/styles/components/_ads.scss

@@ -972,6 +972,27 @@ h3 {
   margin-bottom: 9px;
 }
 
+.apply-for-ad-modal-form-control {
+  border: none;
+  box-sizing: border-box;
+  outline: 0;
+  position: relative;
+  width: 100%;
+}
+
+.apply-for-ad-modal-form-control input[type="date"]::-webkit-calendar-picker-indicator {
+  background: transparent;
+  bottom: 0;
+  color: transparent;
+  cursor: pointer;
+  height: auto;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: auto;
+}
+
 .apply-for-ad-modal-form-control label {
   font-family: "Source Sans Pro";
   font-style: normal;
@@ -1221,3 +1242,24 @@ h3 {
   color: #226cb0;
   cursor: pointer;
 }
+
+.create-ad-form-control-first-step-input {
+  border: none;
+  box-sizing: border-box;
+  outline: 0;
+  position: relative;
+  width: 100%;
+}
+
+.create-ad-form-control input[type="date"]::-webkit-calendar-picker-indicator {
+  background: transparent;
+  bottom: 0;
+  color: transparent;
+  cursor: pointer;
+  height: auto;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: auto;
+}

src/assets/styles/components/_patterns.scss

@@ -268,7 +268,7 @@
 }
 
 .pattern-details-card-sub-card-add-email input,
-  .pattern-details-card-sub-card-add-email select {
+.pattern-details-card-sub-card-add-email select {
   margin-right: 18px;
   flex: 50;
   box-sizing: border-box;
@@ -313,7 +313,7 @@
   flex-direction: column;
   height: 256px !important;
   border: 2px solid#ccc !important;
-  background:rgb(224, 224, 224) !important;
+  background: rgb(224, 224, 224) !important;
   border-radius: 6px;
   padding: 1rem;
 }
@@ -619,6 +619,32 @@
   color: #272727;
 }
 
+.custom-drawer-sub-card-content-sub {
+  border: none;
+  box-sizing: border-box;
+  outline: 0;
+  position: relative;
+  width: 100% !important;
+}
+
+.custom-drawer-sub-card-content-sub input {
+  width: 100% !important;
+}
+
+.custom-drawer-sub-card-content-input-1::-webkit-calendar-picker-indicator,
+.custom-drawer-sub-card-content-input-2::-webkit-calendar-picker-indicator {
+  background: transparent;
+  bottom: 0;
+  color: transparent;
+  cursor: pointer;
+  height: auto;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: auto;
+}
+
 .custom-drawer-sub-card-content-sub-label {
   font-family: "Source Sans Pro";
   font-style: normal;

src/components/Patterns/PatternFilters.js

@@ -94,24 +94,30 @@ const PatternFilters = ({
               </div>
               <div className="custom-drawer-sub-card-content">
                 <FormGroup style={{ marginBottom: "9px" }}>
-                  <label className="custom-drawer-sub-card-content-sub-label">
-                    Od
-                  </label>
-                  <input
-                    type="date"
-                    onChange={(e) => setFromDate(e.target.value)}
-                    value={fromDate}
-                  />
+                  <div className="custom-drawer-sub-card-content-sub">
+                    <label className="custom-drawer-sub-card-content-sub-label">
+                      Od
+                    </label>
+                    <input
+                      type="date"
+                      className="custom-drawer-sub-card-content-input-1"
+                      onChange={(e) => setFromDate(e.target.value)}
+                      value={fromDate}
+                    />
+                  </div>
                 </FormGroup>
                 <FormGroup>
-                  <label className="custom-drawer-sub-card-content-sub-label">
-                    Do
-                  </label>
-                  <input
-                    type="date"
-                    onChange={(e) => setToDate(e.target.value)}
-                    value={toDate}
-                  />
+                  <div className="custom-drawer-sub-card-content-sub">
+                    <label className="custom-drawer-sub-card-content-sub-label">
+                      Do
+                    </label>
+                    <input
+                      type="date"
+                      className="custom-drawer-sub-card-content-input-2"
+                      onChange={(e) => setToDate(e.target.value)}
+                      value={toDate}
+                    />
+                  </div>
                 </FormGroup>
               </div>
             </div>

src/pages/AdsPage/CreateAdFirstStep.js

@@ -11,6 +11,7 @@ const CreateAdFirstStep = ({
   expiredAt,
   setExpiredAt,
 }) => {
+
   const employmentTypeHandler = (type) => {
     setEmploymentType(type);
   };

src/pages/PatternsPage/PatternsPage.js

@@ -138,73 +138,6 @@ const PatternsPage = ({ history }) => {
         selectionLevelFilter={selectionLevelFilter}
         onChangeFilterCheckboxes={handleFilterCheckboxes}
       />
-      {/* <CustomDrawer
-        title="Šabloni"
-        open={openFilterDrawer}
-        onCloseDrawer={closeFilterDrawerHandler}
-      >
-        <form onSubmit={submitFiltersHandler}>
-          <div className="custom-drawer">
-            <div>
-              <div className="custom-drawer-sub-card">
-                <div className="custom-drawer-sub-card-label">
-                  <p>Kategorija</p>
-                </div>
-                <div className="custom-drawer-sub-card-content">
-                  <FormGroup>
-                    {selectionLevelFilter.map((process) => (
-                      <FormControlLabel
-                        key={process.id}
-                        control={
-                          <Checkbox
-                            value={process.name}
-                            checked={process.isChecked}
-                            onChange={handleFilterCheckboxes.bind(
-                              this,
-                              process.id
-                            )}
-                          />
-                        }
-                        label={process.name}
-                      />
-                    ))}
-                  </FormGroup>
-                </div>
-              </div>
-              <div className="custom-drawer-sub-card">
-                <div className="custom-drawer-sub-card-label">
-                  <p>Datum kreiranja</p>
-                </div>
-                <div className="custom-drawer-sub-card-content">
-                  <FormGroup style={{ marginBottom: "9px" }}>
-                    <label className="custom-drawer-sub-card-content-sub-label">
-                      Od
-                    </label>
-                    <input
-                      type="date"
-                      onChange={(e) => setFromDate(e.target.value)}
-                      value={fromDate}
-                    />
-                  </FormGroup>
-                  <FormGroup>
-                    <label className="custom-drawer-sub-card-content-sub-label">
-                      Do
-                    </label>
-                    <input
-                      type="date"
-                      onChange={(e) => setToDate(e.target.value)}
-                      value={toDate}
-                    />
-                  </FormGroup>
-                </div>
-              </div>
-            </div>
-            <div className="custom-drawer-submit">
-              <button className="c-btn c-btn--primary">Pretrazi</button>
-            </div>
-          </div>
-        </form>
-      </CustomDrawer> */}
       <CustomModal
         open={openAddPatternModal}
         onCloseModal={closeAddPatternModalHandler}
@@ -260,17 +193,6 @@ const PatternsPage = ({ history }) => {
               onInit={(evt, editor) => (addPatternEditor.current = editor)}
               style={{ height: "100px !important" }}
             />
-            {/* <textarea
-              rows="11"
-              value={addPatternMessage}
-              onChange={(e) => {
-                if (e.target.value === "\n") {
-                  setAddPatternMessage("<br>");
-                } else {
-                  setAddPatternMessage(e.target.value);
-                }
-              }}
-            ></textarea> */}
           </div>
           <div className="add-pattern-modal-form-control">
             <input type="submit" value="DODAJ ŠABLON" />
@@ -343,16 +265,6 @@ const PatternsPage = ({ history }) => {
               onInit={(evt, editor) => (editPatternEditor.current = editor)}
               style={{ height: "100px !important" }}
             />
-            {/* <textarea
-              rows="11"
-              onChange={(e) =>
-                setEditPattern((oldState) => ({
-                  ...oldState,
-                  message: e.target.value,
-                }))
-              }
-              value={editPattern ? editPattern.message : ""}
-            ></textarea> */}
           </div>
           <div className="edit-pattern-modal-form-control">
             <input type="submit" value="UREDI ŠABLON" />