wrapper.cljc

(ns react.wrapper
  #?(:cljs (:require ["react" :as react]
                     [goog.object :as obj])))

#?(:cljs

   (defn component [display-name render]
     (let [f (fn [props] (apply render (obj/get props "value")))
           m (react/memo f #(= (obj/get %1 "value") (obj/get %2 "value")))]
      (obj/set f "displayName" display-name)
      (fn create-element [& props] (react/createElement m #js {:value props}))))

   :clj

   (defmacro defc [name argv & body]
     `(def ~name (react.wrapper/component (name '~name) (fn ~argv ~@body)))))



(comment
  (defc Component1 [arg1 arg2]
    (react/createElement "div" nil arg2))
  
  (defc Component2 [arg1 arg2]
    (react/createElement "div" nil arg2))
  
  (defn App []
    (let [[state update-state] (react/useState {})]
      (Component1 state "an arg")
      (Component2 state "another arg")))
  
  (defn start []
    (react-dom/render (react/createElement App) (js/document.getElementById "app"))))