Skip to content

findOne still returning array in angular-db #1261

@kenjiqq

Description

@kenjiqq
  • I've validated the bug against the latest version of DB packages

Describe the bug
In angular-db when using findOne in live query it is still returning an array of elements

To Reproduce
Use findOne on any live query

import { Component, inject } from '@angular/core';
import { injectLiveQuery } from '@tanstack/angular-db';
import { eq } from '@tanstack/db';
import { Transtackdb } from '../transtackdb';
import { JsonPipe } from '@angular/common';

@Component({
  selector: 'app-tanstackdb',
  imports: [
    JsonPipe
  ],
  template: `
    <div>Status: {{ query.status() }}</div>
    <div>Loading: {{ query.isLoading() }}</div>
    <div>Ready: {{ query.isReady() }}</div>
    <div>Error: {{ query.isError() }}</div>
    <div>Total: {{ query.data().length }}</div>
    <ul>
      {{ query.data() | json }}
    </ul>
  `,
})
export class Tanstackdb {
  tanstackDb = inject(Transtackdb);

  query = injectLiveQuery((q) =>
    q.from({ todo: this.tanstackDb.todoCollection })
      .where(({ todo }) => eq(todo.id, 1))
      .findOne(),
  );
}
import { inject, Injectable } from '@angular/core';
import { QueryClient } from '@tanstack/angular-query-experimental';
import { createCollection } from '@tanstack/db';
import { queryCollectionOptions } from '@tanstack/query-db-collection';

export type Todo = {
  id: number;
  text: string;
  completed: boolean;
};

const mockData: Todo[] = [
  {
    id: 1,
    text: 'Learn Tanstack DB',
    completed: false,
  },
  {
    id: 2,
    text: 'Build something awesome',
    completed: false,
  },
];

@Injectable({
  providedIn: 'root',
})
export class Transtackdb {
  queryClient = inject(QueryClient);
  todoCollection = createCollection(
    queryCollectionOptions({
      queryKey: ['todos'],
      queryClient: this.queryClient,
      queryFn: async (): Promise<Todo[]> => {
        const response = await new Promise<Todo[]>((resolve) => {
          resolve(mockData);
        });
        return response;
      },
      getKey: (item) => item.id,
    }),
  );
}

Outputs
Status: ready
Loading: false
Ready: true
Error: false
Total: 1
[ { "id": 1, "text": "Learn Tanstack DB", "completed": false } ]

Expected behavior
A single object not an array with objects

Desktop (please complete the following information):

OS: Mac
Browser Chrome
"@tanstack/angular-db": "0.1.52",

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions