Design Pattern with Redux Toolkit
Question
I am struggling on how to implement redux toolkit on my project. I have an API that fetches Setup objects. Each of these objects is quite big with a lot of properties. My initial approach was to use RTK to fetch all of the objects but only with the name and id props. Then, have a separate slice for a single full Setup object that will store all the props of the selected Setup . This is causing a lot of issues for me as state is not loaded appropriately. The current workflow looks as following. First, load all Setups . Then, through a dropdown select a single Setup . Then call an RTK query to fetch all the props of the Setup . Then, load all the props into the slice. And finally, display the props into a component.
Do you have any suggestions on how to implement this feature in a more simple and functional way? I have thought about loading all the props directly instead of just the id and name. Or have two RTKs. One with all the Setups and then another cached RTK for a single Setup . One thing to keep in mind is that I plan to then perform different operations on that single selected Setup such as changing the name, filters, etc.
This is a sample of the API I call to get all the Setup (only name and id ):
[
{
"date": "Sat, 02 Jul 2022 00:14:50 GMT",
"default": true,
"id": "62bf8dfab60731051bcf77dd",
"name": "Default 0"
},
{
"date": "Thu, 30 Jun 2022 22:05:59 GMT",
"default": false,
"id": "62be1e47d4c5f49eb95cd06d",
"name": "Filter Setup"
}
]
This is a sample of all the props of a single Setup :
{
"_id": {
"$oid": "62be1e47d4c5f49eb95cd06d"
},
"name": "Filter Setup",
"default": false,
"filters": [
{
"id": {
"$oid": "62bf8d03b60731051bcf77db"
},
"name": "RRR greater than 1"
},
{
"id": {
"$oid": "62bf8d09b60731051bcf77dc"
},
"name": "RRR greater than 1"
}
],
"state": {
"schema": {
"fields": [
{
"name": "index",
"type": "integer"
},
{
"name": "#",
"type": "number"
},
{
"name": ".m_RRR",
"type": "number"
},
{
"name": ".r_Result",
"type": "number"
},
{
"name": ".r_Result 50% Candle SL",
"type": "number"
},
{
"name": ".m_Entry Candle",
"type": "string"
},
{
"name": ".m_Zone Touch #",
"type": "number"
},
{
"name": ".m_Zone Origin",
"type": "number"
},
{
"name": ".m_Re-entry @ Other Level",
"type": "string"
},
{
"name": ".m_Fast Into Profits",
"type": "string"
},
{
"name": ".m_Trade @ Range Over",
"type": "string"
},
{
"name": ".m_Checked",
"type": "string"
},
{
"name": ".p",
"type": "string"
}
],
"primaryKey": [
"index"
],
"pandas_version": "0.20.0"
},
"data": [
{
"index": 0,
"#": 1.0,
".m_RRR": 3.37,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Hammer",
".m_Zone Touch #": 2.0,
".m_Zone Origin": 1.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 1,
"#": 2.0,
".m_RRR": 2.43,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Hammer",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 2,
"#": 3.0,
".m_RRR": 2.29,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Engulfing",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 3,
"#": 4.0,
".m_RRR": 2.97,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Engulfing",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 4,
"#": 5.0,
".m_RRR": 3.48,
".r_Result": null,
".r_Result 50% Candle SL": null,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 4.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 5,
"#": 6.0,
".m_RRR": 3.22,
".r_Result": 3.22,
".r_Result 50% Candle SL": 3.22,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 4.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "Yes",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 6,
"#": 7.0,
".m_RRR": 1.98,
".r_Result": 0.0,
".r_Result 50% Candle SL": 0.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 5.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 7,
"#": 8.0,
".m_RRR": 4.8,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 2.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 8,
"#": 9.0,
".m_RRR": 4.59,
".r_Result": 4.59,
".r_Result 50% Candle SL": 4.59,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 2.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "Yes",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 9,
"#": 10.0,
".m_RRR": 1.71,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 2.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 10,
"#": 11.0,
".m_RRR": 2.77,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 2.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 11,
"#": 12.0,
".m_RRR": 2.15,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Hammer",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 12,
"#": 13.0,
".m_RRR": 1.71,
".r_Result": 1.71,
".r_Result 50% Candle SL": 1.71,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 2.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "Yes",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 13,
"#": 14.0,
".m_RRR": 6.0,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 4.0,
".m_Zone Origin": 1.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "Yes",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 14,
"#": 15.0,
".m_RRR": 6.48,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 4.0,
".m_Zone Origin": 1.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "Yes",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 15,
"#": 16.0,
".m_RRR": 5.07,
".r_Result": 4.67,
".r_Result 50% Candle SL": 4.67,
".m_Entry Candle": "Hammer",
".m_Zone Touch #": 2.0,
".m_Zone Origin": 1.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 16,
"#": 17.0,
".m_RRR": 1.86,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 2.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 17,
"#": 18.0,
".m_RRR": 3.87,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Hammer",
".m_Zone Touch #": 8.0,
".m_Zone Origin": 1.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 18,
"#": 19.0,
".m_RRR": 1.97,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 19,
"#": 20.0,
".m_RRR": 3.25,
".r_Result": 3.07,
".r_Result 50% Candle SL": 3.07,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "Yes",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 20,
"#": 21.0,
".m_RRR": 4.15,
".r_Result": 0.0,
".r_Result 50% Candle SL": 0.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 2.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 21,
"#": 22.0,
".m_RRR": 2.44,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 3.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 22,
"#": 23.0,
".m_RRR": 3.9,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 4.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "Yes",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 23,
"#": 24.0,
".m_RRR": 1.92,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 4.0,
".m_Zone Origin": 0.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
},
{
"index": 24,
"#": 25.0,
".m_RRR": 2.66,
".r_Result": -1.0,
".r_Result 50% Candle SL": -1.0,
".m_Entry Candle": "Spinning",
".m_Zone Touch #": 4.0,
".m_Zone Origin": 1.0,
".m_Re-entry @ Other Level": "No",
".m_Fast Into Profits": "No",
".m_Trade @ Range Over": "No",
".m_Checked": "No",
".p": "AUDUSD"
}
]
},
"notes": "",
"author": {
"$oid": "6175d1ad7d0ea08fbd85cc2c"
},
"documentId": {
"$oid": "62bdb1e4acbe566f0779271d"
},
"date_created": {
"$date": 1656626759825
},
"options": [
{
"id": ".m_RRR",
"name": "RRR",
"type": "number"
},
{
"id": ".m_Entry Candle",
"name": "Entry Candle",
"type": "string",
"values": [
"Hammer",
"Engulfing",
"Spinning"
]
},
{
"id": ".m_Zone Touch #",
"name": "Zone Touch #",
"type": "number"
},
{
"id": ".m_Zone Origin",
"name": "Zone Origin",
"type": "number"
},
{
"id": ".m_Re-entry @ Other Level",
"name": "Re-entry @ Other Level",
"type": "string",
"values": [
"No"
]
},
{
"id": ".m_Fast Into Profits",
"name": "Fast Into Profits",
"type": "string",
"values": [
"No",
"Yes"
]
},
{
"id": ".m_Trade @ Range Over",
"name": "Trade @ Range Over",
"type": "string",
"values": [
"No",
"Yes"
]
},
{
"id": ".m_Checked",
"name": "Checked",
"type": "string",
"values": [
"No"
]
},
{
"id": ".p",
"name": "",
"type": "string",
"values": [
"AUDUSD"
]
}
]
}
Please let me know if you need any additional information.
1 answers
solution1
0 2022-07-02 01:58:18
Something like Apollo GraphGL might be useful for you. A GraphQL query could pull in the objects in the exact shape/schema you want, so it's more organized for you. Otherwise, you might want to make some kind of parsing utility function to clean up the response object into a new type of object.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.
Related Question
REACT REDUX - design pattern
What kind of design pattern React Redux is using?
React Native & Redux props correct design pattern
redux toolkit reducer with multiple parameters? redux toolkit
Changing from Redux to Redux Toolkit
Redux with redux toolkit: UI is not changing
redux to redux-toolkit refactoring
Migrating from Redux to Redux toolkit
React: Beginner friendly design pattern for React, MVVM or Redux?
redux toolkit state resets
Related Tags