Bugs, Feedback, improvements

Hey.
First of all, I am very new to Invoice Ninja, but commited the last 3-4 Days to get into the Application to use it as my new invoice tool. So bare with me if I am doing something that is not best practise. My target audience is germany, so using IBAN / BIC would be the default path.

I am running 5.5, self hosted in a docker container and within the days I experienced some issues.
I understand this is a ton of feedback but some of the items may can be answered pretty fast.

Bugs:


- “Due Date”
○ Is prefiled with Net ##
○ But does get filled in the Invoice until I select a Date.
§ Should be prefilled automatically, right?
○ Is there a “invoice payment terms” (like Net 14) variable than can be used? Haven’t found any. I want the Number to put it in the Invoice “Terms” field.
- Term: “Payment Due” and Variable in Design Templates
○ E.g. Localization: German // generall mixed up?
§ E.g. In Hipster Template Term/Label: “Payment Due” Translates to “Fälligkeitsdatum” in → Invoice Mask ←
§ If I change “Fälligkeisdatum” in Localizations the change has no effect on the PDF Design Template.
§ In the pdf template localization it says: “Zahlung überfällig” by default (you see the mix in Invoice Mask and PDF Template) which could be correct but not really form my pov. “Fälligkeitsdatum” would be way better. Anyhow I think there got something mixed up with the variables.
□ To change the term in the PDF I need to change the variable “payment_due” which is not available in the dropdown menu in localization and I figured out somehow.

Feature Request
- Ability to input variables everywhere e.g. into custom fields

Room for improvements
- Date Pick OK/Cancel bottons not working sometimes.
○ I think the root cause of this is, that the iframe of the PDF causes problems as clicking on ok or cancel results in zoom out of the pdf preview in the iframe
○ This might be very very specific and depends on the resolution, scaling, window size and so on. But nevertheless this might can be adressed. Basicly if the Modal Window is partially over the iframe Windows of pdf preview. You cant click the Modal Window options. // Tested with Edge. Workaround. Change Browser window that the Modal Window does not overlay the PDF preview. (you can force this issue with a bigger resolution. e.g. create invoice, scroll down to the preview to the point you can select any modal pick overlay and than try to click something)
○ Another workaround (and mybe also better) would be an option to view the PDF preview on the right. So an option for anther laylout would be nice.
- Use variables $ everywhere (maybe as $$) - I would love to add custom fields and poplate them with like ${date} and than use the custom field in some mask other field.
- Documentation on Variables outdated (Designer: view doc)
- Native QR Code support
- Ability to format (html) Localized Labels. I would like to make the “Total” amount bold with <-strong->
○ Many thing can be done in the designer but I dont know how to edit just one row of id table-totals in the designer.
○ I tried a workaround to Localize (custom labels) the label and format it with html. This does not work.
- Abiility to Add payment details like IBAN BIC, havent seen anything like this
○ Workaround is to use Custom Company Fields. This just should not be the case.
○ Currently I placed Bank Details in the Invoice Footer but would like define it as a payment Option which than has variables (for each field, iban, bic, name of bank) and than can add as an id to the Invoice Footer. So than I could use 1 source for everything.
○ I also read here that more than one banking account with iban/bic should be supported. I agree.
- Clicking on any setting without changing anything triggers “continue editing”, “discard changes” prompt. Could be better implemented. Or give the ability to use hotkeys like “1” (discard) or 2" (continue) [or anything else. Not recommending “c” as it could be "cance"l in customers heads instead of “commit” or “continue”.
- Hotkeys in generall would be nice.

Don’t understand
- App_url
○ What is the purpose for the environment variable?
○ How does it cololate with a different url when using the Customer Portal?
- Require_https
○ Self explaining, but what does it change in the workflow? I havent seen any difference while setting true or false
- PDF_Generator: snappdf, are there others? Which is best practise, are there differences?
- APP_Debug
○ What will change if true? Just 1-2 examples, besides the warning/message in the navigation.
- Portal URL
○ Using the protal on another subdomain causes trouble as:
§ Portal URL request data from original source (like APP_URL Domain)
§ Harder for Authentic services like Authelia
- Change to React app?
○ Whats the point of this? What will change, are there any benefits? Future change?
- PDF Preview
○ Invoice vs. Designer: I added a custom QR Code and in the designer preview the QR-code is rendered. In the Invoice preview it is not.

Thanks in advance for everyone taking the time to read or may answer some stuff. :wink:
Unfortunatly the format of the bullet points got lost :frowning:

1 Like

Hi,

The due date isn’t set until the invoice is marked as sent.

@david is there a variable to show the payment terms in number of days?

You can improve the app translations here (Invoice Ninja localization | Transifex) or update locally in the app on Settings > Localization > Custom Labels.

I’m not sure why a custom label wouldn’t show on the PDF, maybe it’s the wrong string value?

You can resolve the iFrame issue by enabling the alternate PDF viewer on Settings > Device Settings or use the native desktop app (Desktop Apps | Invoice Ninja).

@david thoughts on supporting variables in custom fields?

What do you mean by “Documentation on Variables outdated”?

The APP_URL is used by the backend to generate application links, for example the link to the invoice included in the email.

Require HTTPS should prevent the app from being reachable using HTTP.

Info on PDF options: Free Source Available Invoicing, Expenses & Time-Tracking | Invoice Ninja

APP_DEBUG has a more of an effect on the client portal than the admin portal.

The React is better for large accounts and users who prefer a simpler web interface.

1 Like

Wow, thats a fast partial answer. :slight_smile:

Blockquote
You can improve the app translations here (Invoice Ninja localization | Transifex) or update locally in the app on Settings > Localization > Custom Labels.

I understand, but I think there is some missmatch in the application belonging to the Label of Due Date. To change “Due Date” in Template i need to change the Custom Label “payment_due” and not the predefined “Due Date”.

PDF overlay Issue: Thanks!

Blockquote
What do you mean by “Documentation on Variables outdated”?

Free Source Available Invoicing, Expenses & Time-Tracking | Invoice Ninja

APP_URL: I understand, but how does it makes sense with the ability to change URL for the Portal? I would like to follow the approach like: ninja.domain for creators and invoice.domain for the portal. Customers should not know anything about ninja.domain.

@david any thoughts on due_date versus payment_due?

The link for the PDF docs loads correctly for me?

You can set a separate client portal URL on Settings > Client Portal.

@hillel

I did set a separate client portal URL on Settings > Client Portal; but that only gets me to the main InvoiceNinja login, not the InvoiceNinja client portal login.

@david any thoughts?

@WAZ

I’ll answer inline as best as I can

- “Due Date”
○ Is prefiled with Net ##
○ But does get filled in the Invoice until I select a Date.

This is by design, the invoice stays in draft mode and we only inject the Due Date when the invoice is marked as sent or emailed. You can safely leave it blank, the system will automatically calculate the due date based on your payment terms

○ Is there a “invoice payment terms” (like Net 14) variable than can be used? Haven’t found any. I want the Number to put it in the Invoice “Terms” field.

We don’t have a terms field, people typically use the due date, however if you think you would prefer $terms days or similar we can add this in

§ If I change “Fälligkeisdatum” in Localizations the change has no effect on the PDF Design Template.
§ In the pdf template localization it says: “Zahlung überfällig” by default (you see the mix in Invoice

You may want to share a screenshot of what you are translating here, you may be using a different key than what is being used in the design
**Feature Request**
- Ability to input variables everywhere e.g. into custom fields

This has come up before, the reason we don’t implement this is because it is very expensive in compute time. We do allow variables in the Public Notes and terms section as a compromise.

- Ability to format (html) Localized Labels. I would like to make the “Total” amount bold with <-strong->

We have some reasonable docs on this, you can access any of the selectors to add bold etc etc, note this is a section of the app we will iterating on to improve

Don’t understand

- App_url
○ What is the purpose for the environment variable?
○ How does it cololate with a different url when using the Customer Portal?

This defines the URL to the admin portal we use this to define the full URL path in the application for resources.

- Require_https
○ Self explaining, but what does it change in the workflow? I havent seen any difference while setting true or false

When set to true it forces the application to ONLY use HTTPS

- PDF_Generator: snappdf, are there others? Which is best practise, are there differences?

snappdf generates PDFs locally using chrome/chromium. It is the most performant PDF generator however it does take some configuration to get working as there are system dependencies it relies on which are not installed by default on most systems.

hosted_pdf generates the PDFs on our hosted servers. With this option, the HTML of your PDF is posted to our servers, we convert it on the fly to PDF and return it back to you. We don’t store anything on our systems and is provided as a convenience for users who just want to send PDFs without any hassles of configuring anything.

- APP_Debug
○ What will change if true? Just 1-2 examples, besides the warning/message in the navigation.

This should only ever be set when you need to debug an error where the application may not be working for some particular reason. It should never be set to TRUE permanently as you can leak credentials.

- PDF Preview
○ Invoice vs. Designer: I added a custom QR Code and in the designer preview the QR-code is rendered. In the Invoice preview it is not.

Unsure on this, it may be something to do with resolving the URL resources for the QR Code?

3 Likes

Thanks for the fast and detailed feedback. Most of my questions are resolved now. Thanks so far. For less clutter I repeat some uncommented lines from my original post at the bottom.

About the answered stuff a short comment:

  • Due Date: Now understood.
  • A variable with $terms.days would be nice in the future.
  • Maybe I have some kind of missunderstanding/missconception about the Due Date (assignment/translation) so I created a screenshot. I just want to confirm if this is intended. Or If I am mixing stuff up (in my logic)
  • Variables everywhere, I understand the concerns about the performance hit. I am fine with it, but maybe it might be in optional experimental feature that can be enabled/disabled? But no pressure from my side
  • Bold font: Solved with your hint, thanks! I thought I could not change as the ID defines several items.
  • APP_URL / Company Portal: Ok. But I have concerns about the option to change URL of the Customer Portal than. As described before (Using another domains, crawls data from the original Domain (css, js folder), which should not be the case)
  • PDF and QR Code: also not sure, now it’s working.

Open Topics

  • What do you think about a layout option with the pdf preview on the right instead of the bottom? - For me this would work way better. [Like in the Designer]
  • Payment Details like IBAN/BIC: Anything you might want to change? More than 1 Bank Account? What is the best practise from your pov? [to implement and show Bank Details, current Workaround works with compay1, company2 variables.
  • Web UI: Continue, Discard triggerd even if nothing was changed.
  • Hotkey support. Alt+I (Invoice), Alt+C (Customers), 1 (Continue), 2 (Discard) etc. // Any thoughts?
  • React App: Any option to take a look at it in a docker container? Simpler Web Interface sounds interessting for a quick look.
1 Like
  • I’m not sure there would be enough horizontal space, the form on the invoice design page is much narrower than the edit invoice form.
  • You can use the default invoice terms to show it.
  • If discard is showing without making any changes it would be a bug, if you change and then un-change a setting not showing discard changes would be an enhancement.
  • We’d like to support this in the future.
  • @david can you please advise about using the React app with Docker.
  1. I would say starting with using 24" monitor a vertical view would make sense. I mean the implementation should be easy, as its present for designer and giving ppl a choice doesn’t seem wrong. :slight_smile:
  2. Yeah I understand but I think the implementation could be better. e.g. with generation QR Code with googleapi single fields are needed and other users requested several accountings. In the end I never want to define anything twice / duplicated.
  3. You are right, no bug but could be enhanced.
  4. Nice :slight_smile:
  5. Low priority, only if you think this could make sense in any way.
  • Does the Screenshot about Due Date clearify my issue?

  • Did you understand my issue with different Company Portal and other Subdomain?

  • I have another Idea/feature request for variables
    In “Generated Numbers” we can define variables. I would like to have the option also to define similar variables in “Custom fields”. Example: Normaly I have to add a for like a period of time. Like: 09/01/2022 - 09/31/2022. Those are additional custom fields in invoice for me. It would be nice to prepopulate them with “{$date:m}” (or maybe even more complicated variables/conditions. - What do you think about it?

btw who ever might look for the qr code line. based on some thread in this forum here is my polished version:

company2=IBAN
company3=BIC

<img src="https://chart.googleapis.com/chart?cht=qr&chco=000000,ffffff&chs=200x200&choe=UTF-8&chld=Q|0&chl=BCD%0A002%0A2%0ASCT%0A$company3%0A$company.name%0A$company2%0A$client.currency$amount_raw%0A%0A%0A$number" class="qr-code img-thumbnail img-responsive" />

#1. Seems reasonable to make it an option, feel free to create an issue here: Issues · invoiceninja/admin-portal · GitHub

#5. @david any thoughts?

@xoo

you would need to append /client/ to the url to land on the client side.

Sorry if I missed it here but is there a way to add the link to the generated PDF? Possibly in a custom field?

Free Source Available Invoicing, Expenses & Time-Tracking | Invoice Ninja

$view_link - Entity view link ie. View Invoice
$view_url - Entity view url ie. https://link.to.resource

2 Likes

Open unclear Issues: