Finances V2.0 - Sprint 70 Technical Document

Owned by Joyce Sato-Reinhold
Last updated: Sept 20, 2023
10 min read

Reference Documents

Scope

  • This sprint will primarily be concerned with wrapping up custom revenue and custom expenses

    • Expenses readonly / edit / delete & Sale API + saga update – DESIGNS EXIST; tickets needed

    • Revenue needs readonly / edit (non-crop type) / delete (= update to new modal) designs @David Trapp – but we have a newly refactored edit view to work off of

  • We also want to prepare for these new requirements + user stories which remain in Finances 2.0 and will the the focus of our next sprint.

    • Generate income statement: “As a farmer I want to be able to generate an income statement so that I can understand if my farm has been profitable over a set timeframe”. Should include revenues, expenses, and gross profit (Priority: Highest)

    • Finances dashboard: “As a farmer I want to be able to understand my financial position at a glance when landing on the finances page so that I can quickly understand the financial footing of my operation” (Priority Medium)

 

Remaining revenue and expense flow tasks

Epic Link: https://lite-farm.atlassian.net/browse/LF-3597

 

 

tasks

 notes

Kevin’s comments

 

 

tasks

 notes

Kevin’s comments

1

 

 

Update the “edit individual expense” flow

https://lite-farm.atlassian.net/browse/LF-3627

Readonly view is disabled inputs

 

2

 

 

 

 

Update the “edit individual revenue” flow

https://lite-farm.atlassian.net/browse/LF-3628

Readonly view is disabled inputs

 

 

Number Input bugs (3):

 

 

 

3

The onChange handler (as far as I can tell) on AddExpense is buggy in Portuguese. This is the situation in which @David Trapp was not able to enter a comma and the decimal cleared the whole input. This is specific to that Input and not the others.

Fix AddExpense value Input for Portuguesehttps://lite-farm.atlassian.net/browse/LF-3643

Please test in Spanish and other comma-based decimal languages as well

 

4

Validation messages are not displaying when valueAsNumber is set to true (image from the new GeneralRevenue)

 

Relatedly the minimum validation for the current AddSale total field is flakey (sometimes the error message displays onBlur and sometimes doesn’t)

Fix validation messages for currency inputs https://lite-farm.atlassian.net/browse/LF-3644(Crop Sale, General Sale, Add Expense, and their read-only + edit views)

 

As below, the behaviour of the Unit (e.g. the Harvest Quantity of Edit Expense) is correct

 

5

The handling of decimals in Add Sale and Edit Expense is mediocre. The behaviour of the Harvest Quantity component is ideal: decimals should become commas (when appropriate in that language) and rounding to two decimals should occur onBlur

Update finance currency Inputs to share the internationalization behaviour of Harvest Quantity (a <Unit /> component)

https://lite-farm.atlassian.net/browse/LF-3641

Getting ideal behaviour may or may not involve refactoring from an Input to a Unit

 

From an initial look into the code, I think it’s actually an inherent behaviour of the (native) input once we’ve applied roundToTwoDecimal from useUnit to the value

 

 

Technical Notes

https://docs.google.com/spreadsheets/d/1gxdVJieGehQDLbI08WKExoH95yNDgfVcC3xR6n5x0fs/edit?usp=sharing

Generate income statement

Dashboard Views

  • Although this rework is visually substantial, most of the data is already present within three existing components, accessed via Finances, Actual Revenue, and Other Expenses

    • Note as revenue types is a new concept in Finances 2.0 we do not have organization by type in Actual Revenue. Other Expenses already contains this breakdown by type

  • Date filtering already works correctly via the <DateRangeSelector /> “component” which controls the date_range within the financesReducer slice of the store

  • Here and elsewhere you might notice that the container + pure component architecture is not always followed. It is preferred but not required for the dashboard tickets.

  • Please continue to use the old Redux architecture as it is functional

  • We are still waiting designs to be confirmed as final, so there is some risk of the visuals changing (noted below)

    • Note on the Figma Mockup: we are using the second panel of “Finances homescreen” as our current guide for the main homepage dashboard, with the addition of the date filtering from the third panel


Epic Links:

 

 

tasks

 notes

Kevin’s Comments

 

 

tasks

 notes

Kevin’s Comments

1

Preliminary Dashboard Task

Convert the following class-based components into functional components:

 

 

2

 

Create reusable summary tile component

https://lite-farm.atlassian.net/browse/LF-3616

Low risk (consistent throughout design document)

Ideally, we would change “My balance” to “Profit / loss” and have “Total revenues” on the left and “Total expenses” on the right. I assume (hope ) these are trivial changes.

3

 

Create/update existing transactions list <Table /> component to new style

https://lite-farm.atlassian.net/browse/LF-3617

Slight risk design might change, particularly the top and bottom table frame

For the homepage (not filtered for a specific expense or revenue type) we would need to display the type as well. Given the horizontal real estate constraints, it might be a good idea to do something like this - where the name is the instance and the email is the type. Thoughts @Loic Sans ?

 

4

 

 

 

Create swipeable summary icon tiles component. Please use the existing icon tile component as your guide / base.

https://lite-farm.atlassian.net/browse/LF-3618

Medium risk –

consistent throughout design document

BUT Duncan doesn’t like it and Loïc may not either

@Loic Sans thoughts?

 

Also, what happens when they are clicked? I can imagine:

  1. They are multi-select filters for the rest of the dashboard

  2. They take you to a specific page for that type of revenue or expense

5

Update <Finances /> container and components. All data is available.

https://lite-farm.atlassian.net/browse/LF-3619

Blocked by 1

Requires at least one of 2, 3, or 4 - ticket owner should feel free to subtask and apply whichever component(s) are available

 

6

 

Update <OtherExpensens /> container and components. All data is available in current container.

Please base visuals on homepage / Revenue below. This needs updating.

https://lite-farm.atlassian.net/browse/LF-3620

Blocked by 1

Requires at least one of 2, 3, or 4 - ticket owner should feel free to subtask and apply whichever component(s) are available

 

Please do not implement “Last 30 days” filtering before checking in with product (it doesn’t appear on the homescreen tiles)

Has any work on this begun @Joyce Sato-Reinhold? If not, I think we may be able to cut scope here.

7

 

Update <ActualRevenue /> container and components. A new breakdown by Revenue Type is necessary for the summary icon tiles. All other data is available in current container.

https://lite-farm.atlassian.net/browse/LF-3621

Requires at least one of 2, 3, or 4 - ticket owner should feel free to subtask and apply whichever component(s) are available

Please do not implement “Last 30 days” filtering before checking in with product (it doesn’t appear on the homescreen tiles)

Same comment as Expenses screen.

8

Build container and component to filter export report data. Add three-dots menu to Finances homescreen to trigger export.

https://lite-farm.atlassian.net/browse/LF-3622

BLOCKED BY PRODUCT – Older design; I would prefer to get this confirmed before working.

 

PDF export is not part of scope so that radio button should not exist

@Loic Sans and I discussed this and I believe he would like to try a different approach.

9

Export structure / POC

Build saga, API route, controller, and utility function to generate and return an xlsx file

https://lite-farm.atlassian.net/browse/LF-3623

See technical notes above. Only send and write to file three values (revenue, expenses, balance) and trigger download automatically as in current uploaded document functionality.

 

10

Date Inputs in the <DateRangeSelector /> component are weird – they don’t input manually properly and the validation does not match stylistically to the rest of the app.

Also they are buggy (console warnings appear) when invalid dates are input, and entering an invalid date on the current Finances homescreen and then navigating to Actual Revenue will whitescreen crash (see screenshot below). IF we retain something similar for date filtering in the new design, this needs to be fixed

Update the Date inputs used in <DateRangeSelector />

https://lite-farm.atlassian.net/browse/LF-3637

They probably can to be migrated to <Input type={'date'} />

Actual Revenue in the current app might be a good model of the changes required – although it is also a bit buggy

 

 

 

 

 

 

 

 

 

 

 

 

 



 

 

 

Questions & Answers

For product team

 

Question

Answer

Question

Answer

What’s the relationship between the old Labour view and the new Labour expense tile? Is there a migration covering this? For now is the old Labour summary view removed?

Related comment: https://lite-farm.atlassian.net/browse/LF-3553


ticket to add type “Labour”: https://lite-farm.atlassian.net/browse/LF-3564

Good question! Ideally they could be shown on the same table as other expenses and just be filtered by clicking on the labour category. We would need to display additional data though. For example, using this as a base:

We would see something like:

Transaction | Date | Amount

John (3.25 hours) | 25 Jun '23 | $77

Labour

All completed tasks for a given day should be aggregated into one row as “Labour expenses”, e.g.

“Labour expenses (22 hours) | 25 Jun '23 | $940”

Ideally, this would be expandable to something like this:

or link to the existing labour page for details like this:

Open question on whether should be pre-filtered for that specific date (Kevin is in favour, Joyce prefers the prior date filters to take precedence)

Is estimated revenue removed? Where should it go now?? @David Trapp

It should still exist (it’s removal was an oversight) and be incorporated in some manner into the top level KPIs (Profit / Loss, Total Revenue / Total Expenses). It might make sense to have a toggle for “Current vs Projected” or show both numbers on the same card with different styles. Thoughts @Loic Sans ?

A few examples how current and projected could work on the same visualization (current is the red, projected is the remainder of the bar - both would need numerical values)

Simple stacked bar graph:

Also relevant is “Current profit / loss” an “Projected profit / loss”

Horizontal bar graph showing “Current revenue” and “Projected revenue” by crop.

 

For all it is for the filter criteria.

Are tooltips on the current finance page being carried over? Not in designs @David Trapp

They will be updated with new tooltips that align with the new designs. I assume this will be small-ish change, but correct me if this isn’t the case.

Does document export need to be recorded somewhere (e.g. in the database)?

Like a record that it was exported or should it be persisted after generation? I assume no on both counts but I’m open to being shown the error of my ways.

Still need the following aspects of the Excel report:

  • What should the triggering flow look like (ticket 8 in the table directly above)

  • What does the report look like – we have full flexibility to style

  • Will we offer the option to email (e.g. as with farm map download)

  • Permissions on the API route?

@Loic Sans is investigating!

 

Here is a rough guide for the income statement export: https://docs.google.com/spreadsheets/d/1gxdVJieGehQDLbI08WKExoH95yNDgfVcC3xR6n5x0fs/edit?usp=sharing

 

@David Trapp any way you could translate this and show it to the partners on Sep 19, 2023 for feedback?

 

Not needed. If it simplifies to reuse this flow I’m all for it!

 

Ability to see “Export” interaction - whatever that eventually looks like - and hit the export API are limited to FO / FM / EO.