Deraen

Merge with map literal

(merge a {:a 1 :b 2}) -> (assoc a :a 1 :b2)

(-> foo (merge {:foo :bar}) -> (-> foo (assoc :foo :bar))

Reasoning:

• Performance
• Easier to read?

Deraen

• (:identity req) is auth backend independent way to access user data
• login and logout implementation depends on auth backend
• :current-user doesn't imply that authentication is required, route should also have :auth-rules if authentication is required

Deraen

(ns example.react-konva-image
  (:require [reagent.core :as r]
            ;; This presumes Shadow-cljs (or cljsjs packages with correct definitions)
            [react-konva :refer [Stage Layer Image]]
            [use-image :as use-image]))

(defn lion-image []
  (let [[image] (use-image "https://konvajs.org/assets/lion.png")]
    (r/as-element [:> Image {:image image}])))
;; or, without Reagent hiccup -> React elements step, directly creating React element:

Deraen

(defn router-component [match]
  (let [[view-component & nested-view-components] (:views match)]
    (if view-component
      [view-component (assoc match :views nested-view-components)])))

(defn topics-view [match]
  [:div
   [:div "List of topics..."]
   ;; Nested router, renders nothing or topic-view if in :topic

Deraen

(ns spec-test.core
  (:require [clojure.spec :as s]))

(defn x-integer? [x]
  (if (integer? x)
    x
    (if (string? x)
      (try
        (integer/parseint x)
        (catch exception e

Deraen

(ns metosin.dates
  "Use this namespace to format dates and datetimes for user.
   Don't use for serializing or deserializing.
   Clojure side uses always Helsinki timezone.
   On Cljs side, uses the timezone of browser."
  #?(:cljs (:require goog.date.UtcDateTime
                     goog.date.Date
                     goog.i18n.DateTimeFormat))
  #?(:clj  (:import [org.joda.time DateTimeZone])))

Deraen

(ns foobar.search
  (:require-macros [cljs.core.async.macros :refer [go]])
  (:require [cljs.core.async :refer [<! chan put!] :as a]
            [reagent.core :as reagent]
            [reagent.ratom :refer [atom]]))


; Source: https://gist.github.com/Deraen/946ac9e6c6211c83f1e9
(defn debounce [in ms]
  "Creates a channel which will change put a new value to the output channel

Deraen

Reagent uses async rendering model. Reagent uses browsers requestAnimationFrame to schedule render calls: https://reagent-project.github.io/news/reagent-is-async.html

Uncontrolled input

[:input {:default-value "foo" :on-change #(js/console.log (.. % -target -value))}]

Uncontroller input is an input which value is not updated by Reagent/React if the value set in the code changes. After initial render, the value is only changed by users interactions.

Deraen

(reg-event-fx :get-current-party
  (fn [{:keys [db]} _]
    {:db (assoc db :loading? true)
     :kekkonen {:query :api.party/get-current-party
                ;; called with the body
                :on-success [:set-current-party]
                ;; or simple assoc-in?
                :on-success [:assoc-in [:current-party]]
                }}))

Deraen

Problem

Currently libraries need to write some logic to load JS libraries from various places. For example Reagent supports:

1. (Default) Cljsjs packages which export js/React, js/ReactDOM, js/ReactDOMServer and js/createReactClass
2. Npm packages, with require when using Node target

Because the default is Cljsjs, Reagent namespaces depend on cljsjs namespaces like cljsjs.react. This means that to use Reagent with option 2. requires creating empty stub namespaces that provides these.