WorksHub · Alex-Bakic · Mar 8, 2020 · Mar 8, 2020 · Mar 8, 2020 · Mar 8, 2020
@@ -362,7 +362,8 @@
           valid-cv-link? (or (= type :upload-cv)
                              (s/valid? ::specs/url cv-link))]
       (cond
-        valid-cv-link?
+        ;; sub handles the case when a link is nil, and won't show it in the views
+        (or valid-cv-link? (empty? cv-link))
         {:db       db
          :graphql  {:query      graphql/update-user-mutation--approval
                     :variables  {:update_user (graphql-cv-update db)}
@@ -543,6 +544,22 @@
   profile-interceptors
   (fn [db [link]]
     (assoc-in db [::profile/cv :link] link)))
+
+;; little event for the close link icon, as there is no dispatch-n function :/
+(reg-event-fx
+ ::remove-link
+ (fn [{db :db} _]
+   {:db db
+    :dispatch-n [[::edit-cv-link ""]
+                 [::save-cv-info]]}))
+
+(reg-event-fx
+ ::remove-cv
+ profile-interceptors
+ (fn [{db :db} _]
+   (let [file-map {:type nil :name "none" :url "http://"}]
+     {:db (assoc-in db [::profile/cv :file] file-map)
+      :dispatch [::save-cv-info]})))
 
 (reg-event-db
   ::select-suggestion

@@ -319,6 +319,19 @@
   :<- [::cv-data]
   (fn [cv _]
     (:cv-link cv)))
+
+(reg-sub
+ ::cv-file-uploaded?
+ :<- [::profile]
+ (fn [profile]
+   (let [clear-map {:type nil :name "none" :url "http://"}]
+     (not= clear-map (get-in profile [::profile/cv :file])))))
+
+(reg-sub
+ ::cv-link-uploaded?
+ :<- [::profile]
+ (fn [profile]
+   (not (empty? (get-in profile [::profile/cv :link])))))    
 
 (reg-sub
   ::error-message

@@ -205,40 +205,64 @@
     [cancel-link]]])
 
 ;; CV section – view
+(defn cv-section-buttons
+  []
+  [:div.cv__buttons
+   (cond
+     (<sub [::subs/cv-uploading?]) [:button.button {:disabled true} "Uploading..."]
+     (<sub [::subs/cv-file-uploaded?]) [:button.button {:disabled true} "Upload resume"]
+     :else [:label.file-label.cv__upload
+            [:input.file-input {:type "file"
+                                :name "avatar"
+                                :on-change (upload/handler
+                                            :launch [::events/cv-upload]
+                                                :on-upload-start [::events/cv-upload-start]
+                                            :on-success [::events/cv-upload-success]
+                                            :on-failure [::events/cv-upload-failure])}]
+            [:span.file-cta.button
+             [:span.file-label "Upload resume"]]])
+   (if (<sub [::subs/cv-link-uploaded?])
+       [:button.button {:disabled true} "Add a link to resume"]
+       [edit-link :profile-edit-cv :candidate-edit-cv "Add a link to resume" "button"])])
 
 (defn cv-section-view
   ([opts] (cv-section-view :owner opts))
   ([user-type {:keys [cv-link cv-filename cv-url]}]
    [:section.profile-section.cv
     [:div.cv__view
      [:h2 "Career History"]
+     [:p "You can upload a maximum of one cv file and one external cv link."]
      [error-box]
-     (when cv-url
-       [:p (if (owner? user-type) "You uploaded " "Uploaded CV: ")
-        [:a.a--underlined {:href cv-url, :target "_blank", :rel "noopener"}
-         (if (owner? user-type) cv-filename "Click here to download")]])
-     (when cv-link
-       [:p (if (owner? user-type) "Your external resume: " "External resume: ")
-        [:a.a--underlined {:href cv-link, :target "_blank", :rel "noopener"} cv-link]])
-     (when-not (or cv-url cv-link)
+     (when (<sub [::subs/cv-file-uploaded?])
+       [:div (if (owner? user-type) "You uploaded " "Uploaded CV: ")
+        [:div.cv__wrapper
+         [:a.a--underlined {:href cv-url, :target "_blank" :rel "noopener"}
+          (if (owner? user-type)
+            cv-filename
+
+            "Click here to download")]
+         (when (owner? user-type)
+           [icon "close"
+            :id (str "cv-file__" cv-url)
+            :class "cv-link__icon"
+            :on-click #(dispatch [::events/remove-cv])])]])
+     (when (<sub [::subs/cv-link-uploaded?])
+       [:div (if (owner? user-type) "Your external resume: " "External resume: ")
+        [:div.cv__wrapper
+         [:a.a--underlined {:href cv-link, :target "_blank", :rel "noopener"}
+          cv-link]
+         (when (owner? user-type)
+           [icon "close"
+            :id (str "cv-link__" cv-link)
+            :class "cv-link__icon"
+            :on-click #(dispatch [::events/remove-link])])]])
+     (when-not (or (<sub [::subs/cv-file-uploaded?])
+                   (<sub [::subs/cv-link-uploaded?]))
        (if (owner? user-type)
          "You haven't uploaded resume yet."
          "No uploaded resume yet."))]
     (when (owner-or-admin? user-type)
-      [:div.cv__buttons
-       (if (<sub [::subs/cv-uploading?])
-         [:button.button {:disabled true} "Uploading..."]
-         [:label.file-label.cv__upload
-          [:input.file-input {:type "file"
-                              :name "avatar"
-                              :on-change (upload/handler
-                                          :launch [::events/cv-upload]
-                                          :on-upload-start [::events/cv-upload-start]
-                                          :on-success [::events/cv-upload-success]
-                                          :on-failure [::events/cv-upload-failure])}]
-          [:span.file-cta.button
-           [:span.file-label "Upload resume"]]])
-       [edit-link :profile-edit-cv :candidate-edit-cv "Add a link to resume" "button"]])]))
+      [cv-section-buttons])]))
 
 ;; Private section – view
 

@@ -182,6 +182,17 @@ $avatar-size-mobile: 60px
         align-items: center
     .button
       margin: 10px
+    .cv__wrapper
+      display: inline-flex
+      .cv-link__icon
+        width: 24px
+        height: 24px
+        margin-left: 10px
+        fill: #dedede
+        cursor: pointer
+        transition: fill .2s
+        &:hover
+          fill: darken(#dedede, 25%)
 
 .profile-section__applications__job
   border-bottom: 1px solid $pale-gray
@@ -248,4 +259,4 @@ $avatar-size-mobile: 60px
 .avatar-picker
   margin: 18px
   .avatar
-    margin-left: 18px
+    margin-left: 18px