Dashboard Widget – trying to get a sample widget to work of work item feed

Hey,

due to there not being a native matrix-style report for work items, I decided to give it a shot myself, and am currently in the youtrack demo app project. I got so far that the widget gets displayed and I can fetch the workitems from the instance. However, iterating over them, they have no author etc. despite the docs stating they should have some. first I thought the missing query fields were the issue, but with them specified it's throwing heaps of errors.

The logs:

Upload id: 2026_09_27_WKwSXH68SEUeULwmkrjC1v (file: console-export-2026-9-27_20-58-4.log)

This is the code (sorry for my messy typescript. I only know JS so far):

import React, {memo, useCallback} from 'react';
import Button from '@jetbrains/ring-ui-built/components/button/button';
import Heading from "@jetbrains/ring-ui-built/components/heading/heading";

// Register widget in YouTrack. To learn more, see https://www.jetbrains.com/help/youtrack/devportal-apps/apps-host-api.html
const host = await YTApp.register();

// @ts-ignore
let workItems: unknown = []
const fetchWorkItems = async () => {
    try {
        const ytResponse = await host.fetchYouTrack(
            'workItems',
            {
                query: {
                    fields: "author, text, duration"
                }
            }
        );

        console.log(ytResponse);
        // @ts-ignore
        workItems = ytResponse;
    } catch (e) {
        console.error(e);
    }


}
await fetchWorkItems();


const AppComponent: React.FunctionComponent = () => {

    return (
    <div className="widget">
      <Heading>Logged Time Entries</Heading>
      <p>{
          // @ts-ignore
          workItems.length} items found</p>


        {   // @ts-ignore
            workItems.map((item, i) => {
            return (
              <div key={i}>
                  <p>{item.author} logged {item.duration} and left description: {item.text}</p>
              </div>
            )
        }

    )}
      {/*<Button primary onClick={callBackend}>{'Make HTTP Request'}</Button>*/}
    </div>
  );
};


export const App = memo(AppComponent);