Creating an object with values of JSON path - json

Question

I implemented i18n with useTranslation and tried to make it easier for json path to be written.
JSON
{
"userInfo":{
"name": "Name",
"lastname": "Last Name"
},
"sideMenu:{
"home":"Home"
}
}
So now when I try to access translated text I go
t("userInfo.name", "Name")
I tried to make a function that will recursively call it self and create the object like this
object = {
userInfo: {
name: {
key:"userInfo.name",
value:"Name"
},
lastname: {
key:"userInfo.lastname",
value:"Last name"
},
},
sideMenu: {
home: {
key:"sideMenu.home",
value:"Home"
}
}
}
so now I could access like this
t(object.userInfo.name.key, object.userInfo.name.value)
I tried using entries and fromEntries function but I simply cant get hold of the logic behind it.

Answer 1

I made it work with a recursive function so now, no matter the number of nested objects function will return a new object with key and value items.
You can see working snippet with json file i used for the project.
let en = {
"userInfo":{
"name": "Name",
"lastname": "Last Name",
"gender": "Gender",
"age": "Age",
"location": "Location",
"address": "Address",
"city": "City",
"login": "Login",
"about": "About"
},
"comboBox": {
"loading": "Loading...",
"loadmore": "Load More"
},
"error": {
"errormsg": "Ooops, it seems you are not authenticated to see this...",
"errormsgsub": "Get back and try again",
"errorbtn": "Back to Safety",
"alertmsg": "You should login first!"
},
"sideMenu": {
"home": "Home",
"logout": "Logout",
"croatian": "Croatian",
"english": "English",
"hello": "Hello"
},
"loadingPage": {
"load": "Loading...",
"loadsub": "Please wait"
}
}
function languageRecursion(data, key){
if (typeof data === 'object') {
return Object.fromEntries(
Object.entries(data).map(([ikey, value]) => {
return [ikey, languageRecursion(value, key ? `${key}.${ikey}` : ikey)];
})
);
}
return { key: key, value: data };
}
let locale = languageRecursion(en)
console.log("path",locale.userInfo.about.key)
console.log("value", locale.userInfo.about.value)
With this working now you can call languages with i18next useTranslation hook faster and easier.
t(locale.userInfo.name.key)