-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
first step of first class useselected
- Loading branch information
1 parent
fd430a4
commit 142bb85
Showing
14 changed files
with
1,363 additions
and
53 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| { | ||
| "scripts": { | ||
| "deps": "yarn install", | ||
| "watch": "shadow-cljs watch app;", | ||
| "release": "shadow-cljs release app;", | ||
| "server": "shadow-cljs server;", | ||
| "clean": "rm -rf target; rm -rf public/js/*; touch public/js/main.js" | ||
| }, | ||
| "dependencies": { | ||
| "create-react-class": "^15.6.3", | ||
| "react": "^16.8.6", | ||
| "react-dom": "^16.8.6", | ||
| "shadow-cljs": "^2.8.42", | ||
| "showdown": "^1.9.0" | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| ;; shadow-cljs configuration | ||
| {:lein true ;{:profiles "+prod,-dev"} | ||
|
|
||
| ;; set an nrepl port for connection to a REPL. | ||
| :nrepl {:port 8777} | ||
|
|
||
| :builds | ||
| {:app | ||
| {:target :browser | ||
| :output-dir "public/js" | ||
| :asset-path "/js" | ||
|
|
||
| :modules | ||
| {:devcards | ||
| {:entries [react-hitch.devcards-runner] | ||
| :depends-on #{:default}} | ||
| :test | ||
| {:entries [react-hitch.test-runner] | ||
| :depends-on #{:default}} | ||
| :default | ||
| {} | ||
| } | ||
| :compiler-options {:source-map true | ||
| ;; This is done in ribbon and transient_state. | ||
| :warnings {:protocol-multiple-impls false | ||
| :single-segment-namespace false} | ||
| :language-in :ecmascript5 | ||
| :language-out :ecmascript5 | ||
| :cache-analysis true} | ||
| :dev {:compiler-options {:devcards true}} | ||
|
|
||
| :devtools | ||
| ;; before live-reloading any code call this function | ||
| {;:before-load crnklrn-deps.core/stop | ||
| ;; after live-reloading finishes call this function | ||
| ; :after-load breeze.jib.main/rerender! | ||
| ;; serve the public directory over http at port 8700 | ||
| :http-root "public" | ||
| :http-port 8700 | ||
| ;; :handler breeze.jib.server.figwheel-ring-handler/static-ring-handler | ||
| :preloads [devtools.preload]}}}} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| (ns react-hitch.descriptor-specs | ||
| (:require [hitch2.def.spec | ||
| :refer [def-descriptor-spec]] | ||
| [hitch2.graph :as graph])) | ||
|
|
||
| (def-descriptor-spec react-hook-spec | ||
| :curator | ||
| :canonical-form :vector) | ||
|
|
||
| (def-descriptor-spec react-hitcher-process-spec | ||
| :process) | ||
|
|
||
| (def react-hooker (graph/positional-dtor react-hook-spec)) | ||
|
|
||
| (def react-hitcher-process (graph/->dtor react-hitcher-process-spec nil) ) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,20 @@ | ||
| (ns react-hitch.graph | ||
| (:require | ||
| [crinkle.component :as c] | ||
| [cljsjs.react :as react] | ||
| [goog.object :as gobj])) | ||
|
|
||
| (def GraphContext | ||
| "The application's graph manager" | ||
| (js/React.createContext nil)) | ||
|
|
||
| (def GraphContext-Provider (.-Provider GraphContext)) | ||
|
|
||
| (def GraphContext-Consumer (.-Consumer GraphContext)) | ||
|
|
||
| (defn with-graph | ||
| "Return an element which will run body-fn with a single argument: the graph | ||
| manager" | ||
| [body-fn] | ||
| (c/RE GraphContext-Provider nil | ||
| (fn [x] (body-fn (gobj/get x "value"))))) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,85 @@ | ||
| (ns react-hitch.hooks | ||
| (:require | ||
| ["react" :as react] | ||
| [hitch2.graph :as h] | ||
| [hitch2.protocols.graph-manager :as graph-proto] | ||
| [react-hitch.graph :refer [GraphContext]] | ||
| [react-hitch.descriptor-specs :refer [react-hooker]] | ||
| [crinkle.component :as c])) | ||
|
|
||
| (defonce ^:private LOADING #js{}) | ||
|
|
||
| (defn loaded? [x] | ||
| (not (identical? LOADING x))) | ||
|
|
||
| (defn- get-dtor [gm dtor nf] | ||
| ;; TODO: -get-graph marked deprecated, unsure of replacement | ||
| (get (graph-proto/-get-graph gm) dtor nf)) | ||
| (defn useEquiv | ||
| "Takes a value and a comparison function. Returns an equivalent (but not | ||
| necessarily identical) value. The comparison function must be hook-static. | ||
| The comparison function must take an old and new object and return true if | ||
| they are equal and false if they are not. | ||
| The identity of the returned object will only change on subsequent renders | ||
| if the comparison function returns false; otherwise it will return the | ||
| equivalent object from a previous render so that hooks that look for | ||
| deps array changes will not detect a change. | ||
| This function exists because useMemo, useEffect & company do not accept a | ||
| custom comparator, so immutable equal-but-not-identical values retrigger | ||
| these hooks unnecessarily. Use this hook on values you intend to include | ||
| in a deps array. | ||
| Example use: | ||
| (let [v (useEquiv v =) | ||
| m (react/useMemo #(some-expensive-fn v) #js[v])] | ||
| ,,,) | ||
| Note the comparison function runs during the render phase, so keep it fast. | ||
| See also `useEquivDeps`, `use=`, `use=deps`." | ||
| [value equal?] | ||
| (let [vref (react/useRef value) | ||
| oldv (.-current vref)] | ||
| (if ^boolean (equal? value oldv) | ||
| ;; unsure if better to have an always-setting fn and include value in the | ||
| ;; deps; or to do this. | ||
| oldv | ||
| (do (set! (.-current vref) value) | ||
| value)))) | ||
|
|
||
| (defn use= | ||
| "Like `useEquiv`, but with a hardcoded cljs = comparison function" | ||
| [value] | ||
| (let [vref (react/useRef value)] | ||
| (if (= value (.-current vref)) | ||
| (.-current vref) | ||
| (do (set! (.-current vref) value) | ||
| value)))) | ||
|
|
||
|
|
||
| (defn useSelected | ||
| "This hook requires that GraphContext be set." | ||
| ([dtor] | ||
| (useSelected dtor LOADING)) | ||
| ([dtor not-found] | ||
| (let [;dtor-ref (react/useRef dtor) | ||
| dtor (c/use= dtor) | ||
| g (react/useContext GraphContext) | ||
| s (react/useState (get-dtor g dtor not-found)) | ||
| dtorval (aget s 0) | ||
| setdtorval (aget s 1)] | ||
| (react/useEffect | ||
| (fn [] | ||
|
|
||
| #_(identity g [react-hooker | ||
| [:subscribe-hook setdtorval dtor]]) | ||
| (let [val (get-dtor g dtor not-found)] | ||
| (when (and (loaded? val) (not= dtorval val)) | ||
| (setdtorval val))) | ||
| #_(identity g [react-hooker | ||
| [:unsubscribe-hook setdtorval dtor]])) | ||
| #js[dtor]) | ||
| dtorval))) |
Oops, something went wrong.