« first day (3896 days earlier)      last day (1035 days later) » 

7:58 AM
usually you can name the outputs from a array output like this (lets say I have a string const str = "foo#bar"): const [foo, bar] = str.split("#");. But now I want to add this stuff into an object, and right now I have to do: ...{ foo: str.split("#")[0], bar: str.split("#")[1]) }
I would like to avoid writing and running the split twice...
 
user13780186
8:30 AM
Hello devs. I would like to ask. how to return the translated word to string instead [object object] I'm using react i18next
 
9:00 AM
@BeginnerCoder Read the documentation and do it correctly. All you need is a correct i18n.js setup/config and then use react-i18next to access the translation f.e. with useTranslation Hook or Trans component. If it's not working, you are doing something wrong and we don't know what if you don't add some code (Minimal Working Example)
 
9:19 AM
@Markus do not think too far ๐Ÿ˜€
you're pretty close to the solution lol
||> const obj = {}; [obj.foo, obj.bar] = 'aaa#bbb'.split('#'); obj
 
@KarelG {"foo":"aaa","bar":"bbb"} Logged: `` Took: 0ms
 
Air
0
Q: Build @ Angular_12 without @ Angular / cli on WebPack_5

AirColleagues, trying to put together a side ** Angular_12 ** without ** Angular / cli ** based on ** Webpack_5 **. I am very familiar with ** AngularJs ** and know how to import *** Css, HTML, .... and the rest *** But in this assembly I cannot figure out how to import and include ** css && html **...

 
@Air Can you help me understand why you don't want to use the Angular CLI to build?
 
the problem is that I want to do it inside a map function, so if possible I would like to avoid the creation of objects etc. I would like to just write it something like myArray.map(str => ({ str.split("#")[foo, bar] }) or similar...
 
@phenomnomnominal Ya know, for me, people that does not want to use a CLI interface - for whatever reason they might have - of something, there is no hope for them
@Markus now you come with a different requirement ...
 
9:31 AM
did I? ahaa, sorry, I might have missed that in my initial text.
 
and why are you QQ'ing on a performance of creating a single object?
that is measly nothing
 
QQ'ing?
 
> so if possible I would like to avoid the creation of objects etc.
.map(str => {const obj = {}; [obj.foo, obj.bar] = str.split('#'); return obj;})
is this not an option?
 
ok, It's definitely an option. I mean in worst case I can just go with returning a array, but it would be nice to name it. Your solution does that. I was just hoping for a neat way to destruct the values in one beautiful bracket syntax :)
 
Air
9:54 AM
@phenomnomnominal, I just want to assemble it myself... Is this a problem?
 
user13780186
@makadev I already follow the instructions but on the react grid, where I added on the headerValuGetter it return [object object] it need to return a string.
 
user13780186
const localizeHeader = (params) => {
  let headerIdentifier = params.field;
  const test = <Translation>{
    (t, { i18n }) => (
      t(headerIdentifier)
    )
  }</Translation>;
  console.log(test);
  return test;
}

gridColDefs.map((x) => { return { ...x, headerValueGetter: localizeHeader(x) } });
 
So anyone knowss how to makee a windspeed map/library for mapping like is done hint.fm/wind?
 
10:19 AM
@BeginnerCoder localizeHeader(x) returns a react component which (probably) renders the string returned by t(headerIdentifier), if you need the string you need to use either the useTranslation Hook for Function Components or withTranslation HOC for Class Components to get t and return t(headerIdentifier) directly
 
@Markus have a named function ๐Ÿ˜‰
 
yes
 
11:22 AM
hey hey
export class ScannedCardMetrics extends Component {
  constructor(props){
    super(props)
    this.isOpen = false;
  }

//..

  toggleOptions(){
    this.isOpen = !this.isOpen;
    alert(this.isOpen)
  }

}
TypeError: Cannot read property 'isOpen' of undefined
 
@Suisse this aint what you're thinking :)
 
@KarelG yeah this is madness.
 
@Suisse if you are trying to use toggleOptions in JSX/TSX as a function you need to f.e. create a function bound to that instance like this.toggleOptions = this.toggleOptions.bind(this); in constructor or use arrow function toggleOptions = () => {...} or something like that, see reactjs.org/docs/faq-functions.html and additionally, why is isOpen not in state?
 
I need to bind that this. ... but only in react?! in a normal js class you don't have
 
11:37 AM
lol no
React has documented what you can do if you want to share properties/variables
(also, it is vanillaJS way as well ... )
 
@KarelG please help me out here.. why lol no? when I don't bind it I get the error, when I bind it it works. so why no?
 toggleOptions = () => {...}
this is the solution without binding
@makadev summed it perfectly up. thx
 
@Suisse toggleOptions = () => {} is binding too, it creates an anonymous function bound to the instance (on construction) and assigns it the property toggleOptions
it's just doing so implicitly
you can also do <button onClick={() => {this.toggleOptions()}}> ... </button> which instead creates an anonymous function every time it is rendered, bound to that instance
it's not a react thing, it's just that react expects a "function" so when a "method" is passed instead, the instance (this) is missing because the method will be called as function
but it's a common misstake
or mistake?
 
hah! hehe
ok thx... I mean I somehow get it... and tomorrow I'll be forgeting it again ( no idea how to say this in english)
 
11:53 AM
@Suisse dementia? ๐Ÿ˜
 
@KarelG no but somehow just not really really getting it.. I don't get it.
so for now I can use it.. but tomorrow I'll have the same question again
 
what does getFirstUserDate return in the first example ?
i.e where async in not used
 
12:15 PM
@user123456789 a promise
 
When we create a promise, we need to pass a "function(resolve, reject)" to the constructor
What function does the above case use ?
I mean how is the returned promise resolved or rejected
 
fetch('/users.json') will reject when the fetch fails for whatever reasons and resolve (with the result) if it completes, after that every .then(params => body) will resolve either with the result of body or reject when body throws an error like f.e. response.json() when the response can't be parsed as json
 
@user123456789 the promise constructor was added in initial phase to allow people create these. In essence you do not need to use the constructor. This is for built-in functions.
if you have a promise constructor in your code, then you have a design problem or are not using it correctly
 
Ok. 1 more thing, inside getFirstUserDate, we used "return fetch()", fetch is an asynchronous function, does the return statement wait for it to complete?

(am new to asynchronous concepts)
 
ergo: there is no need to use the promise constructor at all
 
12:27 PM
I am not using it anywhere, I am trying to figure how promises work
 
@user123456789 in that situation, you get a Promise object
using fetch creates a promise. It is being chained and what you get is the result of the last chain
which is a promise object containing userResponse.json() result
 
Can you please have a look at nodejs.dev/learn/…
 
@user123456789 promises does not wait unless you have await in front of that
 
There, inside getFirstUserDate, we used "return fetch(..)...", fetch is an asynchronous function, does the return statement wait for it to complete?
 
no. it does not. You get a Promise object that is pending until it's done
 
12:30 PM
Ohhh!! Thanks!!!!
 
hey
this.oldBarcodeValue = newValue;
how to "throttle" this?
that line is in a event.. almost like a loop
and it gets triggered 100 times a second ... how can I throttle it down
I thik rxjs has something, but just for that to import the whole library? hmm
debouncing!
 
12:51 PM
yeah debounce
 
Morning
 
1:03 PM
||caniuse private
 
  refreshRecognizedMarker(newbarcodeValue){
    //do some slow things with new barcode
  }
   markerControl.addEventListener('markerFound',    debounce((event)=>{
    console.log('Debouncing!')
    this.markerFound = event.target.parameters.barcodeValue;
    this.refreshRecognizedMarker( this.markerFound)
  }, 200))
as I said.. I will have the same question again -.- because I just don't get it.. this is in a class... now it says it doesn't know what this.refreshRecognizedMarker() is
 
1:31 PM
IIRC, sometimes event listeners will cause the window object to be bound to this, rather than your class instance. I've had some luck using bind to keep this pointing at the right thing.
I don't 100% understand why this happens but I'm willing to believe there's a sensible explanation
 
@Suisse a simple lesson for you is that if you are using arrow syntax, don't use this
 
1:52 PM
a react question
so complicated:
ParentComponent:

  updateParent(newVar) {
    alert("newwar "+ newVar)
    this.setState({
      scannedMatrixValue: newVar,
    });
    alert("state " + this.state.scannedMatrixValue)
  }

Child1 = new Child(updateParent);

render(
        <Child2
          title={this.state.scannedMatrixValue}
        ></Child2>
)


Child1 takes the updateParent() as callback and calls it with a new value



Child2 should now get that value and show it


so I have in Child2:
 
@Suisse Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. You have 25 seconds to edit and format your message properly before it will be removed. Please separate code blocks from your actual question. Put your question in 1 message and then your code in a 2nd and format it.
For posting large code blocks, use a paste site like like gist.github.com, hastebin.com, pastie.org or a demo site like jsbin.com
 
//child2
  componentDidUpdate(props) {
    alert("updated "+ props.title)
}


^
alert gives "updated " null
    //in parent:
    alert("newwar "+ newVar); // newwar 20

    alert("state " + this.state.scannedMatrixValue)  // state 20

   // in Child2 componentDidUpdate()
       alert("updated "+ props.title)  // "updated" null
ok I noticed this:

componentDidUpdate(prevProps, prevState); has only the prevprops.. but not the new
 
 
1 hour later…
3:28 PM
!!choose terra swamp forest
 
terra
 
 
1 hour later…
4:46 PM
@TylerLazenby Please don't post unformatted code - hit Ctrl+K before sending, use up-arrow to edit messages, and see the faq. You have 25 seconds to edit and format your message properly before it will be removed. Please separate code blocks from your actual question. Put your question in 1 message and then your code in a 2nd and format it.
1 message moved to Trash can
 
Why the heck does Javascript make the option text the value of the option if the option has no value attribute?
<select>
  <option id="check">Choose One</option>
</select>


console.log(document.getElementById('check').value);
// This logs "Choose One"
 
5:03 PM
@TylerLazenby what should it do?
 
It should be just an empty value
It should be the same as <option value>Choose One</option>
 
guess its to make it easier
 
Javascript makes me mad sometimes
 
5:27 PM
does anyone know anything about saving data in html/javascript
 
@Alfiheimr Welcome to the JavaScript chat! Please review the room rules. If you have a question, just post it, and if anyone's free and interested they'll help. If you want to report an abusive user or a problem in this room, visit our meta.
 
5:39 PM
@Alfiheimr what are you trying to save?
 
6:04 PM
amount of coins, shop upgrades, basically a bunch of different variables
however i've fixed my issue at this point
 
6:17 PM
How do JS games usually save player data? Web Storage? I'm never sure how much memory I can expect to get before hitting the quota
 
@TylerLazenby Not sure that's about javascript more than browsers
 
Ah, there's a link to dev-test.nemikor.com/web-storage/support-test which gives an estimate of 5ish MB
 
Local storage or cookies
 
But if you use cookies then you have to put up that obnoxious banner that says "I agree" plus some text nobody reads
For certain definitions of "have to"
 
6:22 PM
i mean
 
I'd go web storage with built-in apis
 
how much data are we talkin about
 
Yes cookies suck
Kevin B. it saves it to your browser but you can't do a lot of local data
 
I believe the question was directed at the other Kevin
I think we need a few more Kevins to be clearly in the hard to follow conversations here
ohgods wait I think I've seen some horrible marvelous piece of code that had embedded an sqlite database inside html document or something
 
In my rarely-executed designs for scripts that use local storage, I imagine I would need like 10kb tops
 
6:29 PM
well at first my save was in an infinite loop and was using a whole lot of data
but i fixed it
and now it works
 
effectively i was trying to imagine a scenario that would require more data than... an object with a dozen properties tops for a JS game. Even things like paperclip etc only really need to store what you've obtained, and can regenerate the game state off of that little bit of info
with such a small amount of data... you could even just store it in the URL
(though local storage would be a whole lot more convenient)
 
7:01 PM
Paperclip maximizer is basically what I had in mind. I see you are a man of culture as well ( อก- อœส– อก-)
 
 
1 hour later…
8:23 PM
@Air the Angular CLI is doing a lot of stuff for you that is a lot of work to setup, like bundle splitting, CSS inlining, running the Angular compiler (on top of TypeScript). It helps with upgrading versions of the framework as well. It's definitely recommended to use it.
 
Air
8:47 PM
@phenomnomnominal. ok
 
9:01 PM
making an electron app in my mind seems always seems so easy
and then i start to do it and it takes forever
 
9:26 PM
You just described programming
 
10:22 PM
posted on June 16, 2021 by Daniel Gagnon

The Beta channel has been updated to 92.0.4515.56 (Platform version: 13982.23.0) for most Chrome OS devices. This build contains a number of bug fixes, security updates and feature enhancements. If you find issues, please let us know by visiting our forum or filing a bug. Interested in switching channels? Find out how. You can submit feedback using 'Report an

 
10:34 PM
posted on June 16, 2021 by Srinivas Sista

The Beta channel has been updated to 92.0.4515.59 for Windows, Mac and Linux. A full list of changes in this build is available in the log. Interested in switching release channels?  Find out how here. If you find a new issue, please let us know by filing a bug. The community help forum is also a great place to reach out for help or learn about common issues. Srinivas Sista Google C

 
11:31 PM
What is a good way to show errors on the form via React when using Axios Post request?
I'm looking for a solution that is re-usable across multiple forms in the React app.
try
{
    const response = await axios.post("auth/user/login", formValues);

}
catch (error)
{
    const exception: AxiosError = error;

    let title = "Error", message: string;

    if (exception.response && exception.response.status === 400)
    {
        message = exception.response.data.message;

        switch (exception.response.data.errorType)
        {
            case "VALIDATION_ERROR":
                title = "Incorrect input";

                let errors = mapApiErrorsToHookForm(exception.response.data.errors)
Currently, I did this
I'm using React Hook Form to do the validation. And if the API throws any error, I use the library's setError() to add a custom error on the field.
But do I need to do this same code on every form?
Any help would be greatly appreciated :)
 
posted on June 16, 2021 by Krishna Govind

Hi everyone! We've just released Chrome Beta 92 (92.0.4515.59) for Android: it's now available on Google Play. You can see a partial list of the changes in the Git log. For details on new features, check out the Chromium blog, and for details on web platform updates, check here. If you find a new issue, please let us know by filing a bug. Krishna Govind Google Chrome

 

« first day (3896 days earlier)      last day (1035 days later) »