This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2020-06-18
Channels
- # announcements (6)
- # babashka (16)
- # beginners (194)
- # calva (20)
- # cider (34)
- # clj-kondo (38)
- # clojure (89)
- # clojure-europe (10)
- # clojure-finland (15)
- # clojure-italy (2)
- # clojure-nl (15)
- # clojure-sg (7)
- # clojure-spec (15)
- # clojure-uk (86)
- # clojurebridge (1)
- # clojurescript (60)
- # community-development (11)
- # conjure (13)
- # core-async (48)
- # core-typed (3)
- # cursive (22)
- # datascript (8)
- # datomic (40)
- # duct (11)
- # emacs (3)
- # figwheel-main (22)
- # fulcro (45)
- # graphql (1)
- # helix (9)
- # hoplon (15)
- # hugsql (7)
- # jobs-discuss (47)
- # juxt (7)
- # kaocha (21)
- # luminus (1)
- # malli (13)
- # meander (2)
- # off-topic (52)
- # parinfer (19)
- # re-frame (66)
- # reagent (1)
- # reitit (3)
- # ring-swagger (1)
- # rum (2)
- # shadow-cljs (72)
- # spacemacs (5)
- # sql (4)
- # timbre (5)
- # tools-deps (15)
- # vim (5)
- # vrac (7)
I am using materia ui like that (but with a different lib), and it's mostly fine. Very verbose, but I am sure a clojure pro can abstract this away.
@U2FRKM4TW could you share a template? thanks
Not sure what you mean by "template". It's a regular Reagent/React interop: https://github.com/reagent-project/reagent/blob/master/doc/InteropWithReact.md
To avoid using :>
everywhere, I have a single material-ui
namespace where I import and define components that I use.
Thanks @U2FRKM4TW I follow the guide, but cannot produce material-table, is the wrong mapping? Thanks.
[:> mui-table/MaterialTable {:title "Basic Export Preview"
:data [{:name 'Mehmet' :surname 'Baran' :birthYear 1987 :birthCity 63 }]
:columns [{:title "Adı" :field "name" }
{:title "Soyadı" :field "surname"}
{:title "Doğum Yılı" :field "birthYear" :type "numeric"}
{:title "Doğum Yeri" :field "birthCity"}]}]
OK, I can't help here - I don't use CLJSJS at all, and advise anyone against using it.
There is a ClojureScript wrapper around mui
There are multiple wrappers for it. Among all that I've found, all are bad, including this one.
They all bring in the full Material UI, completely negating DCE. And Material UI is huge.
Actually, I take it back - the one above is the first one that I see that does it correctly. It has a huge amount of files that you can require separately, which doesn't result in a bloated bundle. Just as Material UI itself, it has a central namespace which should only be used for quick prototyping because using even the smallest component from there will bring in the whole Material UI.
#re-frame is empty so re-posting here. I have a subscription :show-payme that is set to true. When it is set to true, a div is mounted:
(if @(subscribe [:show-payme]
[:div {:id "#card-element"}]
)
I have an fx event that returns the following:
{:db {:show-payme true}
:dispatch [:load-stripe]}
the load-stripe fx event contains the following:
(.mount card-element "#card-element")
The problem is that the .mount is being called before the #card-element div ever mounts on the page, which is causing the #card-element Element Not Found error. How do I get around this?Please don't cross-post. #re-frame is not "empty". Different people have different timezones.
does anyone have any experience with using next.js from clojurescript?
Ok, so I finished my ES6 Class compiler extension, would love some feedback!
@U050B88UR how can I correctly, handle and analyze the method arguments to my custom class?
@flyboarder would help to have an example of how thats actually used?
Sure thing!
(es6/defclass ExtendedClass BaseClass
(constructor []
(prn "ExtendedClass")
(super)))
(es6/defclass MyClass
(constructor []
(prn "MyClass")))
internally it expends to (es6/class MyClass {:constructor ([] ...)})
or (es6/class ExtendedClass BaseClass {:constructor ([] ...)})
for usage as an anonymous instance
I styled the syntax for defclass
in a way that was similar to protocol
@dpsutton yes, specifically when using the shadow-cljs compiler and npm packages which are es6+ and the target is nodejs, we needed to extend a class to enable custom authentication within our underlying js framework
we did get a work around initially going, something like (set! (.. oauth/OAuthStrategy -prototype -getEntityQuery) (fn [& args] ...))
This will spit out native es6 classes, so code that is not compiled when targeting nodejs will still work
additionally, someone else wrote a similar extension for async, which was my inspiration for this hack
@lilactown possibly, but I wasnt sure if the compiler was smart enough to know what a class is when you have the language set to es5
thats the input language not the output language
Actually the above snippet is having issues handling parameters for the methods, im looking into this but if anyone else has any ideas plz halp
seems I am not correctly setting the analyzer locals
[{:description "Regent Thai, Church Street, San Francisco, CA, USA", :id "254f506a2fddd4fecbbbd750e0e91d7871218065", :matched_substrings [{:length 3, :offset 0}], :place_id "ChIJi3wlq2l-j4ARq5Rg0kuektg", :reference "ChIJi3wlq2l-j4ARq5Rg0kuektg", :structured_formatting {:main_text "Regent Thai", :main_text_matched_substrings [{:length 3, :offset 0}], :secondary_text "Church Street, San Francisco, CA, USA"}, :terms [{:offset 0, :value "Regent Thai"} {:offset 13, :value "Church Street"} {:offset 28, :value "San Francisco"} {:offset 43, :value "CA"} {:offset 47, :value "USA"}], :types ["restaurant" "food" "point_of_interest" "establishment"]} {:description "Ebisu Restaurant, 9th Avenue, San Francisco, CA, USA", :id "55ed22b098f6b1b2f1b1d3d1d03d36bc3505d6b3", :matched_substrings [{:length 2, :offset 0}], :place_id "ChIJ93MU4FyHhYARNsN1cMElpgo", :reference "ChIJ93MU4FyHhYARNsN1cMElpgo", :structured_formatting {:main_text "Ebisu Restaurant", :main_text_matched_substrings [{:length 2, :offset 0}], :secondary_text "9th Avenue, San Francisco, CA, USA"}, :terms [{:offset 0, :value "Ebisu Restaurant"} {:offset 18, :value "9th Avenue"} {:offset 30, :value "San Francisco"} {:offset 45, :value "CA"} {:offset 49, :value "USA"}], :types ["restaurant" "food" "point_of_interest" "establishment"]}]
yet when I retrieve the same param in the server, the vector has now become this:
{:terms {:offset ["0" "13" "28" "43" "47" "0" "18" "30" "45" "49"], :value ["Regent Thai" "Church Street" "San Francisco" "CA" "USA" "Ebisu Restaurant" "9th Avenue" "San Francisco" "CA" "USA"]}, :types ["restaurant" "food" "point_of_interest" "establishment" "restaurant" "food" "point_of_interest" "establishment"], :matched_substrings {:length ["3" "2"], :offset ["0" "0"]}, :structured_formatting {:main_text ["Regent Thai" "Ebisu Restaurant"], :main_text_matched_substrings {:offset ["0" "0"], :length ["3" "2"]}, :secondary_text ["Church Street, San Francisco, CA, USA" "9th Avenue, San Francisco, CA, USA"]}, :place_id ["ChIJi3wlq2l-j4ARq5Rg0kuektg" "ChIJ93MU4FyHhYARNsN1cMElpgo"], :id ["254f506a2fddd4fecbbbd750e0e91d7871218065" "55ed22b098f6b1b2f1b1d3d1d03d36bc3505d6b3"], :description ["Regent Thai, Church Street, San Francisco, CA, USA" "Ebisu Restaurant, 9th Avenue, San Francisco, CA, USA"], :reference ["ChIJi3wlq2l-j4ARq5Rg0kuektg" "ChIJ93MU4FyHhYARNsN1cMElpgo"]}
I'm using re-frame's http-xhrio for the Ajax request:
{:method :post
:uri "/foobar"
:params {:my-vec that-vector}
:on-success [:foo]
:on-failure [:bar]
:response-format (edn/edn-response-format)}
printing this ^ gives the map starting with :terms ..., whereas it should give the vector starting with [{:description ...
rather than having two maps with the same keys in the vector, what I have is a single map, and all the values of the two maps are concatenated in a single map in vectors.
this merging behavior might be something that wrap-params does - I'm not sure if there's a way to turn it off
you could try using a map instead of a vector(?) - using some unique key for each