Rewrite managing credit cards page (#252)

docs-sidebar.js

@@ -175,7 +175,16 @@ const sidebars = {
             },
             'budgeting/schedules',
             'budgeting/returns-and-reimbursements',
-            'budgeting/credit-cards',
+            {
+              type: 'category',
+              label: 'Managing Credit Cards',
+              collapsed: true,
+              link: {
+                type: 'doc',
+                id: 'budgeting/credit-cards/index',
+              },
+              items: ['budgeting/credit-cards/carrying-debt'],
+            },
             'budgeting/joint-accounts',
             //unavailable('Returns and Reimbursements'),
           ],

docs/budgeting/credit-cards.md

@@ -1,25 +0,0 @@
-# Managing Credit Cards
-
-Using a credit card in any budgeting software can be confusing, and Actual is no different. Of all the questions that are asked about budgeting, credit card usage is near the top of the list so don't feel bad if you're a little confused. We will try to walk through the process of using a credit card, paying a credit card, and carrying a balance on a credit card here.
-
-I have made several purchases on my credit card. I enter these transactions just like every other transaction and make sure to choose the **Credit Card** account in the ledger. I also make sure that the correct category is chosen. You'll notice that the account balance is **red** and negative. Credit cards are debt, so our starting balance should be 0. Any transaction added to this account will spend money, therefore making the amount more negative. If you are first starting out with Actual, be sure to enter your current balance as a negative number for the starting balance.
-
-![](/img/credit-cards/credit-1.png)
-
-Here is my budget. You'll see I only have 200 in my checking account, so I was only able to budget 200 this month. That's a problem because I overspent by 30.
-
-![](/img/credit-cards/credit-2.png)
-
-I need to cover my overspending, so I change my budgeted amount for Food to 100. You'll see that my **To Budget** amount is now negative.
-
-![](/img/credit-cards/credit-3.png)
-
-I will now use my **Credit Card** budget category to capture that overspending by adding the amount I need to borrow on the credit card to balance the budget. The **To Budget** number should be 0. I am planning on carrying a balance on this credit card now, so I remember to turn on the **Rollover overspending** option on this category. The ensures that I don't lose these dollars that I need to pay on my credit card next month.
-
-![](/img/credit-cards/credit-4.png)
-
-I still need to pay that credit card bill though. I go to my checking account and add a new transaction. This time it's just a transfer between accounts. I can only afford 200 this month, so I move the 200 I have in my checking account to my credit card account.
-
-![](/img/credit-cards/credit-5.png)
-
-Now my **Credit Card** account matches my **Credit Card** debt category. Next month that -30 will still be in my **Credit Card** debt category so I'm going to work extra hard to pay it off.

docs/budgeting/credit-cards/carrying-debt.md

@@ -0,0 +1,9 @@
+# Carrying Debt
+
+Carrying debt on a credit card refers to the situation where you have an outstanding negative balance on the card and do not have the money set aside for paying it off in full when the next bill arrives.  We highly recommend you to _not_ do this for any new spending as it becomes super easy to accidentally fall into deeper debt and that you instead follow the [Within the Budget](./index.md) strategy for any new credit card purchases, but in case you're already carrying a negative balance on a credit card we will on this page outline how to safely manage the debt without having to worry about going more into debt.
+
+If you have an existing credit card debt that you need to track and gradually pay off then it's very important that any new purchases you make with the credit card are pre-funded following the [Within the Budget](./index.md) strategy as there is no point in paying off 100 extra on the credit card if you will then have to put another -100 on the card to pay for groceries the week after.  Instead you should prioritize making sure that your actual expense categories are funded before allocating money to paying down the debt, which will allow you to ensure that you're paying it off in a sustainable manner without accidentally incurring more of it over time.
+
+The simplest way to track preexisting credit card debt in Actual is to create a **Credit Card** category and set it to **Rollover overspending**.  When you add your existing starting balance and any preexisting transactions to your credit card account you need to ensure that the category of those transactions is set to **Credit Card**.  That way you can at any time look at the **Credit Card** category balance to see the status of your preexisting debt, and you can ensure that it's getting smaller over time.
+
+Each month when you do your budgeting, _after_ you've accounted for all other necessary expense categories, you allocate however much you want to pay down on that debt into the **Budgeted** column of the **Credit Card** category.  Then when you go to pay your credit card bill you can easily find out how much you should actually pay by taking the **Credit Card** account balance and turning it positive and then adding the current **Credit Card** category balance to it.  If your account balance is -5500 and your category balance is -4500 then you know that you need to pay off 5500 - 4500 = 1000.  This amount will be greater than what you had put into the **Budgeted** column in case you're simultaneously following the [Within the Budget](./index.md) strategy of pre-funding new credit card purchases, and you can without worries pay off the calculated amount knowing that the money has already been explicitly set aside for this specific bill.

docs/budgeting/credit-cards/index.md

@@ -0,0 +1,59 @@
+# Managing Credit Cards
+
+Using a credit card in any budgeting software can be confusing, and Actual is no different.  Of all the questions that are asked about budgeting, credit card usage is near the top of the list so don't feel bad if you're a little confused.
+
+On this page we will walk you through how to manage a credit card "within the budget" which is the strategy of using a credit card that we highly recommend that you follow.  If you already have a preexisting credit card balance that you haven't budgeted for then we also have you covered, see the [Carrying Debt](./carrying-debt.md) page to find out how to track this debt in a safe and sustainable manner, and try to follow what we describe down below for any future credit card purchases.
+
+Using a credit card within the budget means that for every purchase you make on the credit card, the transaction is added to Actual with a category for which money was already set aside.  This means that as long as you do not overspend in any category you're not incurring any more debt and are able to pay the credit card bill in full whenever it arrives.
+
+
+## Scenario
+
+Below we're going to describe a scenario showing you how you can safely use a credit card without racking up any debt.  There's a lot of text in the following sections but don't worry, actually implementing this strategy is very easy.
+
+
+### Setup {#scenario-setup}
+
+To start with we're going to be creating two accounts, **Checking** and **Credit Card**, both with a starting balance of 0.  We're also going to say that we're receiving 250 in income on the 1st of every month.
+
+In this scenario we're going to say that we're planning on buying a new laptop for 500.  Since we don't have any savings set aside for making this purchase at once we're instead going to create a category called **New Laptop** into which we will budget the money we're saving for this purchase.
+
+
+### Month 1 {#scenario-month-1}
+
+It's the first day of the month and we've just received our salary into our checking account, and so we create a transaction depositing 250 into the Income category.
+
+Since we don't have any other expenses this month we know that we're able to put aside the full 250 that we have available to budget this month into the **New Laptop** category.  Since the category balance is so far only 250 we know that we don't yet have enough money set aside to buy the laptop for 500, and so the purchase will have to wait until another month.
+
+At the end of the month our budget looks like this:
+- **New Laptop** category has a balance of 250.
+- **Checking** account has a balance of 250.
+- **Credit Card** account has a balance of 0.
+
+
+### Month 2 {#scenario-month-2}
+
+The first of the second month rolls around and we've just received our salary again, and just as last month we create a deposit of 250 into the Income category.
+
+Our expenses are unchanged and we yet again budget 250 into the **New Laptop** category.  This means that we finally have a balance of 500 in the **New Laptop** category and are now able to make the purchase we were looking forward to.  So we buy the laptop using our credit card and put the transaction in the **New Laptop** category, since that's the category holding the money we set aside for this very purchase.
+
+Our budget now looks like this:
+- **New Laptop** category has a balance of 0 since we just used the whole balance for the purchase.
+- **Checking** account has a balance of 500.
+- **Credit Card** account has a balance of -500.
+
+Later that month when we receive the credit card bill for 500 and since we know that we didn't overspend in any category we know that we have the money for paying the bill in full already set aside and so we can pay the bill in full with no worries.
+
+When we've paid the bill we account for this in Actual by creating a transfer from our **Checking** account to the **Credit Card** account for 500, meaning that our budget now looks like this:
+- **New Laptop** category has a balance of 0.
+- **Checking** account has a balance of 0.
+- **Credit Card** account has a balance of 0.
+
+Since we made sure to only spend money that we already had budgeted we were able to use the credit card to make a large purchase without any worries of incurring more debt!
+
+
+### Conclusion
+
+Hopefully after reading this example scenario you've seen that managing credit card spending safely can be pretty easy with a little bit of planning.
+
+On the other hand if some emergency comes up where you need to "borrow" some of the money you had set aside for paying the credit card bill then you've overspent your money and are now in debt.  This is perfectly okay, but it means that you need to switch over to following the [Carrying Debt](./carrying-debt.md) strategy for managing this debt.  Following this scenario you'd substitute the **New Laptop** category for the **Credit Card** category.