Automatic Grouping/Sorting of Nested-Lists? - reactjs

I am currently trying to implement a web tool with a capable web developer, but we are stuck on one functionality.
It's about draggable nested lists, which should be grouped and sorted automatically according to different attributes.
The "draggable" is not the problem but the automatic creation of parent & child nested lists and the automatic distribution of the products into the corresponding lists.
For a better understanding I have made a
Figma-Prototype, maybe you will understand what I mean.
I have a database of products with attributes like "producer", "product category", "sub-category", "country" and "region". (However the example is just a table, in reality we made the DB in MongoDB)
I want the user to be able to change the order (drag&drop) and also create new lists(Nested-List Parents & Childrens). However, I would like to spare the Users from having to start at 0 and create and fill all lists manually, for example, when it its just about grouping and sorting "only" by product category.
Is this even Possible? We are working with React (MERT-stack).
Thank you!!
We havent an idea where to start, tbh.

Related

How can I sort and map my SQL query in Ionic?

I have a database running in the background, the aim of the whole thing should be that I have categories as buttons and that categories should be created under elements. I separated the whole thing in the database (i.e. in two tables), i.e. in categories and in the sub-elements. I get everything correctly selected but just don't know how to assign or build it. Does anyone have any ideas or examples to look at?
I've already tried Ionic's list system. Just like ion-record.

WordPress : make categories automatically match according to external API Value

I'm managing a company website, where we have to display our products. We however do not want to handle the admin edit for this CPT, nor offer the ability to access to the form. But we have to read some product data form the admin edit page. All has to be created or updated via our CRM platform automatically.
For this matter, I already setup a CPT (wprc_pr) and registered 6 custom hierarchical terms: 1 generic for the types (wprc_pr_type) and 5 targeting each types available: wprc_pr_rb, wprc_pr_sp, wprc_pr_pe, wprc_pr_ce and wprc_pr_pr. All those taxonomies are required for filtering purposes (was the old way of working, maybe not the best, opened to suggestions here). We happen to come out with archive pages links looking like site.tld/generic/specific-parent/specific-child/ which is what is desired here.
I have a internal tool, nodeJS based, to batch create products from our CRM. The job is simple: get all products not yet pushed to the website, format a new post, push it to the WP REST API, wait for response, updated CRM data in consequence, and proceed to next product. Handle about 1600 products today on trialn each gone fine
The issue for now is that in order for me to put the correct terms to the new post, I have to compute for each product the generic type and specific type children.
I handled that by creating 6 files, one for each taxonomy. Each file is basically a giant JS object with the id from the CRM as a key, and the term id as a value. My script handles the category assertion like that:
wp_taxonomy = [jsTaxonomyMapper[crm_id1][crm_id2]] // or [] if not found
I have to say it is working pretty well, and that I could stop here. But I will have to take that computing to the wp_after_insert_post hook, in order to reaffect the post to the desired category on updated if something changed on the CRM.
Not quite difficult, but if I happen to add category on the CRM, I'll have to manually edit my mappers to add the new terms, and believe me that's a hassle.
Not waiting for a full solution here, but a way to work the thing. Maybe a way to computed those mappers and store their values in the options table maybe, or have a mapper class, I don't know at all.
Additional information:
Data from the CRM comes as integers (ids corresponding to a label) and the mappers today consist of 6 arrays (nested or not), about 600 total entries.
If you have something for me, or even suggestions to simplify the process, I'll go with it.
Thanks.
EDIT :
Went with another approach, see comment below.

How to store custom sort order in a web app

I am developing a React Firebase web app, and I want to implement a "custom" sort on top of sorting by name and date. How should I go about storing this "sort" information?
Do developers append a "key" property to the components themselves? How will reordering work then (do i shift every component's key values by 1? That seems inefficient). Or should I do a separate file or database entry that just stores the order as an array of component id keys?
Should all of this be resorted on page load or should I reorganize the data in a way where as soon as I request them they're already sorted?
I've tried adding the order key prop to every item but it seems overly complicated for a simple feature. I haven't had much luck searching this online.
Firestore allows you to orderBy and limit queries.
You can also specify a cursor to paginate more data on request.
See This Example in the docs for more info.

Dynamically disabling menu based on database query?

So I'm not a programmer, but my friend is. He's trying to help me develop a web/phone app but we are stuck because I'm having trouble communicating to him an idea and he is having trouble understanding. One or both of us is a moron ;) Part of the problem is that I don't even know where to search for the answer cuz I don't know the specific search terms...believe me I've tried...and I've searched stack overflow as well. Here is the problem:
Short Question:
Websites (like hotel search) allow you to search for rooms by selecting checkboxes in certain categories (i.e. smoking/nonsmoking, stars, size of bed, near downtown, etc.). Certainly these sites are referencing a large database of hotels in a city.
How can you create a site so that as you check boxes (narrow your search), other options which are no longer available are dynamically "grayed out" or disabled on the fly so you cannot check those boxes. So if I were to check 4 stars and that excluded all smoking rooms based on the database, then the option to check "smoking" would be disabled.
The key to this is that the site is querying a database as you click boxes, then based on the results of that query (which is presumably many rows of data (a subset)), it is analysing that subset of data to determine whether checkbox options should be on/off, then dynamically "graying out" specific options that are no longer available. Once you got to only a single possible result, then the site would pop up the website for that hotel (or some other action).
What is this called? Where can I get more information on this. Any pointing toward the right direction would be tremendously appreciated.
Thanks so much in advance!
Roy
HERE IS AN EDIT TO ORIGINAL QUESTION...HERE IS AN EXAMPLE:
So here is my sample database. Each Column (i.e. AA, AB, AC) represents a checkbox. '1'= True, '0'= False, and '2'= Either. Therefore, if you click checkbox AA, then only the top three rows would meet the criteria of AA=True. So query would return the top three rows. The '2's could be either True/False so since they don't affect outcome, those checkboxes should be disabled and only the checkboxes CA,CB, & CC should remain choosable. If you then click checkbox CB, then result ZYX would be output.
Conceptually, How do you go from the initial click to the point where the database is queried and the results are used to dynamically change the menu. People have suggested javascript but i am not looking for a language. I am more looking for the concept. I was thinking that the query would return a new "temp" array with just the top three rows. Then each column of this "temp" array would be queried to see if it contained a '1' in any of the rows. If it did, then that button would be turned "ON". If it didn't then that button would be turned "OFF". Is this confusing? Am I asking for too much ;)
This sounds like javascript could help. For example, using jQuery, you can dynamically send queries to databases based on whatever you click on checkboxes, and then reload a particular section of the webpage. Javascript can also dynamically disable checkboxes.

Show custom object in related list under page layout

I have been trying this whole day but cant figure out... I have custom object called Dev which has many to many relationship with Accounts... I want this object Dev to show under related list of page layout of account... But it is not showing there how can i add that to related list?
Assuming you have a lookup relation from Account to Dev and also a lookup from Dev to Account (creating your many-to-many), then this will work fine.
Try re-creating your lookup relationship from Account to Dev. Then make sure that you add the related list and add to the page layouts in steps 5 & 6:
Step 5. Add reference field to Page Layouts (Yes to All)
Step 6. Add custom related lists (Yes)
That's all you need. If, however, your many-to-many relationship is unique or otherwise configured differently (with a junction table, for example) then the above may not work for you.
We always tend to use joining objects for these relationships, obviously you can show the list of joining objects as a related list, and you could display other fields from the dev object by use of formulae.
One thing we've tended to do is create an inline VF page which can then show all of the objects related to the current record.

Resources