Work Notes: Building a Contractor Buddy for Contract Truckers – Part 2

New Day: Thu Jun 08 2023 12:22:50 GMT-0500 (Central Daylight Time)

[-] 528×5 – Mock the REST api post call for Twilio, this will save money and time.

[ ] 51cxt8 – Work on the UI for the scheduling.

[ ] 1489fs – Redesign UI to fit this menu/codesandbox.

[ ] 425x8m – Isolate the problem of why some weren’t. This issue may be challenging.

[ ] 52v4gm – Do other things besides the text message call. Work on the UI for the scheduling. Have it be so that you won’t need* to look at the texts to get what’s going in the trucking company.

[ ] 852vsm – Quickbooks plugin to tie Trucking Buddy with Quickbooks.

[ ] 95fs – I need to make dev url and prod url.

[ ] 418fs – Backup, import and export receipt information ideally in a way which can be imported by Quickbooks.

[ ] 25af4 – How do I add a table in Prisma without dropping the whole db?

[ ] 1452ag – How do I import from a csv file into a Prisma table?

[ ] 15gsbg – Backup from a .csv file.

[ ] 14ags – Add breadcrumbs at the top of the screen.

[ ] 234asd- Switch to SQlite

[ ] 516faw – Get Chase banking API linked as well as be able to link to smaller banks/credit unions.

528×5 – I need to work on the mock call because I don’t have Twilio., so let’s see what that mock call looks like.

I guess the fetch request would look something like this:

const postData = {
  ToCountry: 'US',
  ToState: 'CA',
  SmsMessageSid: 'SMXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
  NumMedia: '0',
  ToCity: 'Los Angeles',
  FromZip: '94107',
  SmsSid: 'SMXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
  FromState: 'CA',
  SmsStatus: 'received',
  FromCity: 'San Francisco',
  Body: 'Hello from Twilio!',
  FromCountry: 'US',
  To: '+1415XXXXXXX',
  ToZip: '90012',
  NumSegments: '1',
  MessageSid: 'SMXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
  AccountSid: 'ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
  From: '+1415XXXXXXX',
  ApiVersion: '2010-04-01'
};

fetch('http://your-node-server-endpoint', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(postData)
})
  .then(response => response.json())
  .then(data => {
    // Handle the response from the server
    console.log(data);
  })
  .catch(error => {
    // Handle any errors that occurred during the request
    console.error('Error:', error);
  });

New Day: Sat Jun 10 2023 11:25:11 GMT-0500 (Central Daylight Time)

This is the URL of the main app, I think that’s the main branch but not for sure. This URL is where I post to.

What if I have the mock file in my app and all I have to do is run a command from the terminal to run it. Like npm run dev:send-mock-sms

…

I just figured out the server and the client side environment variables are treated differently in t3.

…

528×5:

I sent a successful mock http request.

Here is the gist. This file is in, ‘tests/mock-sms-send.ts’ of a t3 project.

This Twilio doc is very important for understanding the post request that they send.

—

Note from the future: Tue Sep 19 2023 13:57:19 GMT-0500 (Central Daylight Time)

Will this work without credits though and what is missed by not using the Twilio API endpoint from Twilio but mocking it locally?

—

New Day: Sun Jun 11 2023 02:52:57 GMT-0500 (Central Daylight Time)

Now that I got a mock test, I need to work on UI for the receipts now becuase this is the most important thing.

…

That would be dope for the mock test I could attach an image and in the response it will say how much is on the receipt.

…

New Day: Mon Jun 12 2023 06:26:53 GMT-0500 (Central Daylight Time)

I guess I’m going to have to work on the Next router with this page.

Notice, this is how you get the menu on this file:

        <MenuWrapper
          menuOptions={menuOptions}
          renderMobileToolbar={Toolbar}
          menuProps={{
            onLogOut: () => alert('Logout clicked'),
            renderHeader: MenuHeader,
          }}
        >

I think I’m going to test it out on this page.

New Day: Wed Jun 14 2023 12:24:54 GMT-0500 (Central Daylight Time)

I’m going to use Responsive Drawer instead because it looks like the previously posted solution is outdated.

So, I need to integrate this file.

Then there will be a page called Employees and then on there you’ll be able to see which receipts are responsible for which employee.

New Day: Thu Jun 15 2023 12:32:50 GMT-0500 (Central Daylight Time)

This CodeSandbox highlights menu items.

New Day: Fri Jun 16 2023 11:36:42 GMT-0500 (Central Daylight Time)

Misc notes:

“

I have to add another accouunt which is cash and then hopefully have that cash deduction be tied to an atm withdrawl or have the source be in some way related.

I think I am going to look into connecting to like a Chase API to get bank spending information.

I would like to have an option to directly take a picture on the Desktop as well as adding an image file.

image

“

New Day: Sat Jun 17 2023 11:14:08 GMT-0500 (Central Daylight Time)

Fixing this type error:

“

Type ‘(data: FormData) => Promise<void>’ is not assignable to type ‘(formData: FormData) => void’.
Types of parameters ‘data’ and ‘formData’ are incompatible.
Type ‘FormData’ is missing the following properties from type ‘FormData’: employeeName, dateHired, dateAddedToCB, amtOfGasPurchasedThisMonth, eligibleRoutests(2322)

AddContactForm.tsx(21, 3): The expected type comes from property ‘onSubmit’ which is declared here on type ‘IntrinsicAttributes & AddContactFormProps’
“

I’m getting an API timeout error but this deployment works.

I need to work on a test so that when a website is done, there is test to make sure there is no 400, 504 errors, etc. So I’m not coding for a day and a half and have to get back to find the error.

Selected menu item appear to be where the issue is at.

This commit.

I think the 504 error I am running into has to do with Vercel messing up.

New Day: Sun Jun 18 2023 09:31:56 GMT-0500 (Central Daylight Time)

So, factoring out those icons worked because they weren’t SSR.

New Day: Mon Jun 19 2023 13:37:08 GMT-0500 (Central Daylight Time)

Finding the commit which I is pre-revert.

This commit – 1.

So bringing it back up.

…

Make the employee addition be very mobile friendly.

I want to make the addition to be at the bottom of the page.

New Day: Tue Jun 20 2023 07:52:27 GMT-0500 (Central Daylight Time)

Make Employee page table mui.

…

New Day: Wed Jun 21 2023 12:51:30 GMT-0500 (Central Daylight Time)

The request:

await fetch("http://localhost:3000/api/receipts", {
    "credentials": "omit",
    "headers": {
        "User-Agent": "Mozilla/5.0 (X11; Linux x86_64; rv:104.0) Gecko/20100101 Firefox/104.0",
        "Accept": "*/*",
        "Accept-Language": "en-US,en;q=0.5",
        "Content-Type": "text/plain;charset=UTF-8",
        "Sec-Fetch-Dest": "empty",
        "Sec-Fetch-Mode": "cors",
        "Sec-Fetch-Site": "same-origin",
        "Pragma": "no-cache",
        "Cache-Control": "no-cache"
    },
    "referrer": "http://localhost:3000/employees/clj4doynn00007rn047efx577",
    "body": "{\"dateSent\":\"2023-02-02\",\"employeeName\":\"\",\"dateTimeOfGasBuying\":\"00:12\",\"amtOfGasPurchased\":\"54\",\"gasTanksAfterFillings\":\"56454\",\"img\":\"https://wp2mag.com/wp-content/uploads/2023/06/th-3080913266.jpeg\"}",
    "method": "POST",
    "mode": "cors"
});

If you getting a 500 error it’s not setup at all if your getting a 400 error then your not sending the right fields. In both cases of this happening make sure to check the node terminal running the app for further assistance.

…

Add receipts attributed to each employee, also, I think may add employeeId on Receipts table.

Updated schema.prisma for this.

I also want to reset the field when an entry is added. I also have to add the list of receipts per employee and I would like this to correlate with employeeId rather than employeeName.

New Day: Thu Jun 22 2023 08:42:33 GMT-0500 (Central Daylight Time)

Okay so in Prisma if you want to add a column you have to delete the whole table otherwise you’ll have to reset the whole db.

…

I need to add the route, and I think I can get rid of that truck extensible type.

I think once the truck drop down is selected than the TruckID can just be equated and filled in.

Side note: It’s good to write down your internal dialog.

…

So when you click on /employees

Receipts area, debts area and schedule area.

If your on the employee’s receipts page the url is

employees/clj4doynn00007rn047efx577

it should be employees/receipts/clj4doynn00007rn047efx577

With the two other areas as well.

…

I need to add the route, and I think I can get rid of that truck extensible type.

I think once the truck drop down is selected than the TruckID can just be equated and filled in.

…

The difference is we won’t know the employee off the bat and we don’t even know the TruckID on Employee receipt addition logic.

The input order:

The Route:

Vehicle Type: Truck or Car:

Vehicle:

New Day: Sun Jun 25 2023 09:35:38 GMT-0500 (Central Daylight Time)

I think I’m going to only use SQLite.

I feel like I’m just trying to ratchet down the latches versus just getting the project done.

New Day: Mon Jun 26 2023 12:46:41 GMT-0500 (Central Daylight Time)

There needs to be a pane which shows active balance. There also needs to be a payments history.

Audio:

“

So like a bottom under the thing, it needs to be like, like one for, like, the receipts, like, open time card. So be like, three things like receipts time card. And then, like, just like, like timeliness, like, showing up and it’ll be like three columns.

It won’t be too confident like three buttons on each one and it’ll be like you know be like a single page app like like it be like snappy I’ll be like first come show like receipts and then like and then the second column show that and then like on top it’ll just be like Like a link to it so people don’t get confused.

“

toDo:

I want there to be a divider between the added receipts and it’ll be like the day and the day month, year, format. Also, it would be cool if you could show how much they still have in their balance after they paid for the receipt.

I want the id for the db to have the id for the route be the first characters if that is at all possibles.

Redo the table on the Trucks page.

New Day: Tue Jun 27 2023 09:23:13 GMT-0500 (Central Daylight Time)

So I tried to do a stack today which included local development on my phone and then I learned Prisma only ships binaries for the Debian AArch64. So I got it to work on that distro on UserLAnd and then I fiddled around trying to dev with both Termux and UserLAnd. Then I figured out you can have multiple terminals on UserLAnd by pulling the drawer from the right and then clicking new session.

New Day: Wed Jun 28 2023 11:02:51 GMT-0500 (Central Daylight Time)

Working on the DateTime stuff for good createdAt logic.

Looking at this file.

I figured that out.

New Day: Fri Jun 30 2023 06:22:06 GMT-0500 (Central Daylight Time)

I need to get different tabs for the employees part, I also want to get the Trucks section worked on better for receipts too.

Need to make a nested list so people know where they are at in the application, demo or here. Also need to work on breadcrumbs too(demo).

…

Got calendar to show, I have to have a window open on each day click and then go from there.

…

NO errors on Prisma still need to ‘regenerate’ the database.

New Day: Sun Jul 02 2023 17:00:43 GMT-0500 (Central Daylight Time)

I am trying to figure out how to fufill the date object with stuff, so I can have an easier time.

Okay, I am going to work on this one:

“

Date Selected:

2022-04-18
Morning
Mid-day
Evening

“

New Day: Sat Jul 08 2023 22:03:49 GMT-0500 (Central Daylight Time)

    // Figuring this out 
    const [isAfternoonWorked, setIsAfternoonWorked] = React.useState(false);

So now that I got that good (the work time keeper) for employee (timecards), I want to do logins so I can use it myself.

Or I could just add myself as an employee and then go from there.

…

The problem is it gets all of them rather than looking for the name/employeeId.

The query is showing all of the records.

So I just need to filter down the results.

New Day: Mon Jul 10 2023 09:48:33 GMT-0500 (Central Daylight Time)

I want to get Contractor Buddy usable in the timecard sense and then focus on EC then after that work on the receipts for it as well as social login.

…

For CB, I need to get it from findMany to get it where it’s only finding the employeeId and then I don’t think I need to discriminate upon addition.

The modal isn’t resetting state on blank ones. I also need to redo the url to point to employeeId rather than id.

New Day: Tue Jul 11 2023 11:06:45 GMT-0500 (Central Daylight Time)

[ ] Reset modal state to reflect other empty ones rather than persisting.

Back to EC then after that work on the receipts for it as well as social login.

MonteLogic

Work Notes: Building a Contractor Buddy for Contract Truckers – Part 2

Leave a Reply Cancel reply