Custom State with multiple lists in one state?!

Hi there,

I currently have a restaurant menu ordering app. I’m trying to figure out how I might be able to make item selections tied to a person or tab but stored in a custom state until I’m ready to process my order. I can achieve this by writing to the database but I want this to be session based (hence the custom state) so that anyone at the table can work on their own order.

Say the customers decide to order by name, ideally this lists shows the following:

John: Lager, Burger, Salad
Anne: Ale, Burger, Fries
Sally: Lager, Fried Chicken

These lists can be customer name based as I listed above OR tab based depending on what the customers decide on doing. In a situation where it’s all on one tab the same list would look like:

All-Together: 2 - Lager, Ale, 2 - Burger, Salad, Fries, Fried Chicken

There could be multiple tabs for groups of people too:

John & Anne: Lager, Ale, 2 - Burger, Salad, Fries
Sally: Lager, Fried Chicken

Somehow I need the list to know which items belong to each person/tab created. I fully understand how to create a list, add to it, remove from it. But I don’t know if I can create a list that has two pieces of information (or in a spread sheet, two columns) for every line (row) entered into it.

I would like my work flow to function as follows:

Customer hits the website and sees the menu in a list form. Customer presses the plus button beside the menu item they want to add to their order and a popup asks who the item is for. Customer selects the name or tab it should go under and continues until they are ready to proceed. When ready to proceed the customer select confirm order where they are showed a detailed list of the people or tab names and what’s currently under each person or tab. Customer confirms then bubble takes the custom states and writes to the database to create the order.

Clear as mud?!

How about, defining a data type ‘_tempOrders’. Setting a state to be that data type and as a list

Then when the person finalizes their order, add it to that state list of _tempOrders

When the table has finalized their orders,send it off to the dB?

This is a rough start ^^^

Learn more

Need to have your database located in your region! Tired of struggling with Bubble or API’s? Need a little functionality that’s not available yet thru current market plugins?

Are you ready to step-it-up or speed it along? Need some custom code or a plugin built? Contact me today to learn how to book a 1-on-1 session, get your plugin built, or yet freelance building support!

1 Like

But how do I combine two lists into one and know which time on the one list belongs to the tab on the other list?

I don’t want to write to the database so it can be session based.

Are people ordering on different devices? If they are then I think the only way is to write to the database. You can always do a recurring workflow to clean out this datatype if you are worried about that side of things.

1 Like

Yes people are ordering from different devices, sometimes at the same time.

If I write to the database the order will replicate on everyone else’s devices. I need it to be session based.

Not at all :slight_smile:

Add a field on your temp order datatype for ‘ordered for’ and make it type ‘user’ - then only call the orders where current user is ‘ordered by’ to display on the page.

You could use the default ‘created by’ field if that suits your use case - but if sometimes someone will order for someone else and you need that person to be able to see only their own at some point then add the ‘ordered by’ field.

1 Like

Ah! Yes. Sorry, we don’t require our guests to create accounts. That would be a major barrier to entry for which we do not want to but the burden onto the customer.

Have a look at cookie plugins and then store the cookie ID on the temp order and filter by that.

I have some questions that are not intended to offend, but rather press you to think through the UX and the likely possibilities. I of course do not know exactly your vision for how this would work, but have myself worked for more than a decade in restaurants and am a Bubble expert.

I am taking some liberties in making some assumptions. The main assumption here is that the Users are actually just going to be a Customer of a Restaurant that is sitting in the Restaurant at a Table who will make an Order to be delivered to the Table and consumed at the Restaurant.

How is this going to happen in practice? Are the customers expected to open their own device and navigate to the application OR are you going to be expecting the Restaurant to have a device at the table for the customers to use?

In either situation, how to you expect to track the proper Table for the Restaurant employees to know which table made the Order?

If you expect the Restaurant to provide the Table with a Device to use, is it expected that the Restaurant would have multiple devices with each Table having it’s own device, OR would the server give the Table a device to use and then remove that device from the Table after the Order has been processed?

All of these scenarios have different implications for your setup.

Example: If it is the multiple device, one for each table that doesn’t leave the table and is affixed to the table, that is easy enough. In this situation your Restaurant would likely have it’s owner version of the application (not an application where multiple restaurants have their own ‘page’ but either their own version of the application or a subDomain). They would then create Users in the Database which would be the Table, as that is what truly an Order in a Restaurant revolves around. Then when they place the device on the table and affix it, any ‘Sessions’ would be created using the “Created By” field as the User (AKA Table).

I would personally venture to guess that not a single person who goes into a restaurant is going to want to use their own device to create an Order while sitting in the Restaurant, so for me personally I would definitely be creating the app in such a way as to expect the Restaurant to provide the device, and in that, making it so that a User is a Table.

In all reality, I personally would make it so that the Server has control over the device and make it so that it is a ‘Mobile POS’ system, something that makes it so the Main Terminal most restaurants may use in conjunction with their existing POS system is replaced by multiple devices that Servers carry with them. With this, the Servers are trained on how to use the system and it will function as smoothly as a restaurant would need it to…Impossible to blame the customer for making a mistake in the ordering process using a software they have no prior knowledge of how to operate properly.

Why give the Customer so much freedom? Because it is not actually freedom you are creating, but rather Friction and making the Ordering Process more difficult for the Customer to navigate.

Your goal for good UX is to make anything a person does on your app as easy as possible, and if they are going to need to decide on "How do we want to do it, should we all add our names or should we create tabs (I believe here you may be referencing a Bill so that users can separate their costs from each others) you are just making the whole process more confusing for the Customer.

Again, I’d build it with expectation that the customer either orders from a device affixed to the table and the order is Simple and based on the Table and not a name or ‘tab’. Either that, or make it so the Server controls the device.

You can do it using the List Shifter Plugin. I use this plugin to create my Shopping Carts to process Orders and I am able to track the items quantity and other related details. The developer of the plugin has put up some videos on the showcase page detailing how to create a shopping cart and do other things with list item tracking…it is essentially what it was first built for I believe.

Again here, this is my personal perspective and you probably strongly disagree, but I personally do not see a situation in which a Restaurant Customer will want to pull out their own device and navigate to the site and find the Restaurant they are currently in to then locate the menu and figure out how to start the ordering process.

Again here, I think this is friction and the Customer should not be made to make this type of decision…besides, this also entails more friction because the Customer will first have to create the list of ‘tabs’ or the list of people at the table.

Think about the friction here. Each time they make a selection of an item they have to then do one more step, which would take anywhere from 2-10 seconds depending on how quickly the user could decide which ‘tab’ or person it belongs to…a large table (I used to serve tables of 20+ people) could take well over 20 minutes to create their Order (and Restaurants would not be happy using an application that reduces their TurnOver Rate).

From my view, both as an experienced service industry participant (I’ve done every job in a Restaurant from dishwasher to cook to bartender) and as an experienced Bubble developer, I think the best approach is to have the Server Control the Device and the Order Process.

This would allow them to have the ability to quickly select from a dropdown menu the Table the order is for, and enter the number of Customers at the Table and Select a Seat Position for the Customer the specific items are for. Then at the end of the meal when the check is ready to be created the Server can ask if they want to separate the Tabs and ask which Customers items belong on the same Tab and quickly select from the Table Position to add certain items to certain Tabs.

I truly hope this helps you think through the UX and the application development.

Learn From an Expert

Boston85719 is an expert Bubbler with a decade experience as an educator. Real name Matthew, he has been actively building SaaS apps, marketplace apps, scheduling apps and more for clients, himself and for sale as templates.

As an official Bubble Bootcamp Instructor, he leads Bubble Bootcamps on a regular basis.

Always willing to offer advice via the Bubble Forum, Matthew also offers Private Personal and Group Training Sessions.

Through his site, NoCodeTrainer, Matthew provides a range of tutorials with editor access to help you jumpstart your Bubble development.

Always accessible you can send Matthew a private message via the forum or send an email directly with your requests.

Be sure to checkout the Stripe Integration Course when you are ready to integrate Stripe payments to start monetizing your application via product sales or subscriptions.

Stripe Integration Course

NoCodeTrainer.com

2 Likes

Hey @boston85719 have a look at Mr Yum Mr Yum - Leading QR Code Mobile Ordering for how customers can order from their own device at a table on a restaurant - and it’s a Bubble app :slight_smile:

1 Like

That looks like a nice site. My points though weren’t about whether it was possible, more about the overall concept from my point of view.

When I go into a McDonald’s or a movie theatre with ‘self-serve’ or a supermarket with ‘self-serve checkout’ there is always a staff member near by to ‘train’ the customer on how to use it…and at the supermarket there is undoubtedly somebody who takes far too much time to do it. So in a high pace environment like a restaurant where turnover time is important, I personally wouldn’t bring a system like this into a restaurant that I owned if I did own a restaurant.

The other aspect from my view is in a restaurant where an order gets accepted directly into a kitchen it is going to be difficult for rectifying mistakes made by a customer (when in the restaurant as an employee it was a regular occurrence to have somebody come into the kitchen to alter an order whether because a mistake had been made when inputting it or alteration request from the customer).

My comments were mostly focused on the UX of the idea. I personally wouldn’t want to pull out my own mobile device to order from a restaurant table. I do not mind doing it when the device is affixed to the table as is done in some restaurants I go to.

Sometimes there are great ideas of how to ‘disrupt’ or ‘improve’ with technology that ultimately are trying to solve a problem that doesn’t exist…my belief is this is an instance of such an idea.

These are personal opinions and not an attempt to dissuade somebody from building an app they want to build, but more a way to think through UX and real world implementation of the idea. :slight_smile:

2 Likes

Appreciate the devil advocate or the “did you think this through” however this is a fully operational solution. We have served over 5,000 parties and processed nearly 14,000 orders to resounding positive feedback. Customers have no issue whats so ever with using their own devices. The only thing we do is ensure a rock solid connecting to the internet so that folks who are traveling and don’t have a data package don’t have to worry.

Our approach to service has always been very different and one would need to visit our establishment to understand what we’re trying to do. @boston85719 You raised a number of very valid points regarding turning tables over but we don’t do that here. We encourage people to hang out and stay for long periods of time.

2 Likes

That is great to hear. I’m glad you are getting good feedback and best of luck with it.

If you are still searching for how to do the multiple lists, check out the list shifter plugin as previously mentioned…I believe it will enable you to do exactly what you are looking for.

I did and I have a conversation with Keith going in this thread:

I’m actually waiting on one last reply for him but haven’t heard back in a few days. If you scroll to the bottom and know the answer to my last question I’d love to be pointed in that direction. Otherwise I’ll start building it the way I’m guessing he’s done it. I just imagine it would be much quicker if I had the video.

Yes you have excellent points to consider as always - I was just sharing the link more as an interest piece :slight_smile:

I actually bookmarked it as I really like the landing page. I’ve been seeing a feature they have on a lot of sites recently, which is a sort of float effect on an element, like an image, when the user is scrolling and I’m interested in figuring out how it is done.

I also think the approach they have for incorporating it into hotel room service is awesome.

They may not use Bubble for the webpage - it might be webflow or something similar :slight_smile:

1 Like

Did you get a solution for this
I have a similar use case where fir each line in a repeating group I want add to an array like thing which in bubble terminology is custom state but does bubble have multidimensional custom state

Exactly like what you are expecting I want create an order and only when the customer confirms I want to add to database