Save store cards/loyalty cards in Home Assistant with a widget on your phone

Feature Requests
1

There are many apps that can hold your store cards/loyalty cards as a scannable barcode. Most of those apps are free, but they sell your data. That’s the reason I don’t want to use such apps, although I find them useful because you don’t need the physical card in your wallet.
I would like to request a feature to store these barcodes in Home Assistant and so they can be shown in the Home Assistant widget with a logo of the store on your phone.

I would like to have the possibility to make the following automation:
Whenever I enter the zone of a specific store, show the correct barcode of the specific store in the widget.

2

Add the image as a local_file integration. Then you can store it as a camera widget using the Android app

3

When you scan the barcode, your data is shared anyway, that is the whole point of loyalty/store cards.

Or to put it another way, the card you keep in your wallet is not an app, nor is it smart, but they still get your data. It is the entry of your ID at the point of sale and associating it with what you just bought that is the point, not an app on your phone.

1 Like
4

I’m using the iOS app. So this workaround seems not possible.

5

Sounds fair. The stores that hand out those card will sell your data, but there are also apps like Stocard in which you can store all your store/loyalty cards, and they will also sell your data.

6

Bastards…

7

Hi,

My solution is to save the barcodes as JPG and use separate subviews with Picture cards to show them. The shortcuts are placed right next to Shopping list card for convenience.
The barcodes were first imported to a wallet app to make neat and uniform screenshots.
So far I had no issues with brightness or contrast during scanning.

Wife loves it.

20230202_180628
20230202_1806281440×1080 66.8 KB

Screenshot_20230202-180401_Home Assistant
Screenshot_20230202-180401_Home Assistant1440×2876 150 KB

2 Likes
8

Mind sharing your yaml code?
Looks pretty nice and would like to use this too!

9

Sure thing.
I have all of this in a separate dashboard.

Raw code 
title: Shopping
views:
  - theme: Backend-selected
    path: default_view
    title: Shopping
    icon: mdi:cart-variant
    badges: []
    cards:
      - type: custom:mushroom-chips-card
        chips:
          - type: back
          - type: template
            picture: /local/loyalty_cards/Albert_Heijn_Logo.png
            tap_action:
              action: navigate
              navigation_path: /loyalty-cards/ah_loyalty
            hold_action:
              action: none
          - type: template
            picture: /local/loyalty_cards/jumbo_logo.png
            tap_action:
              action: navigate
              navigation_path: /loyalty-cards/jumbo
            hold_action:
              action: none
        card_mod:
          style:
            mushroom-template-chip:nth-child(6)$: |
              :host {
                  --icon-size: 80 px;
                }
      - type: todo-list
        entity: todo.shopping_list
      - type: custom:mushroom-chips-card
        chips:
          - type: action
            icon: mdi:sort-alphabetical-ascending
            tap_action:
              action: call-service
              service: shopping_list.sort
              target: {}
              data: {}
        alignment: end
  - theme: Backend-selected
    title: Jumbo
    path: jumbo
    subview: true
    type: panel
    badges: []
    cards:
      - type: picture
        tap_action:
          action: none
        hold_action:
          action: none
        image: /local/loyalty_cards/Jumbo.jpg
  - theme: Backend-selected
    title: Lidl
    path: lidl
    subview: true
    type: custom:vertical-layout
    badges: []
    cards:
      - type: picture
        tap_action:
          action: none
        hold_action:
          action: none
        image: /local/loyalty_cards/Lidl.jpg

The images for icons and cards themselves are stored in www folder.

image

1 Like
10

Can’t seem to get the pictures as a icon to work. always get this message: * At path: chips.1.picture – Expected a value of type never, but received: "/local/loyalty_cards/a.png"

Card mod is installed…

11

Can you show your yaml?

12

I just copied from your raw code, but here is my card yaml code

type: custom:mushroom-chips-card
chips:
  - type: back
  - type: template
    picture: /local/loyalty_cards/a.png
    tap_action:
      action: navigate
      navigation_path: /loyalty-cards/aernoudt
    hold_action:
      action: none
card_mod:
  style:
    mushroom-template-chip:nth-child(6)$: |
      :host {
          --icon-size: 80 px;
        }
13

Do i have to do something special to make the PNG file work as an icon?
Or does the PNG file has to be formatted in a specific way?
Because i Cant see what is wrong, but it does not work.

14

Not that I know of.

The error you get suggests your card doesn’t recognize “pictures” option, which is odd. Do you have the latest Mushroom cards installed?

When I paste your code i get this:
1000036048
So it works, it’s just missing the picture.

Have you tried configuring it through the UI? Then after it works, you can add card mod

15

Okay, just to inform you. I looked deeper into it and i had a mushroom version in the local repository and one in hacs. I deleted the local one and it is working now.

Thanks for thinking and sharing your code!

1 Like