docs: Create Storybook Stories for the Components in the Profile and Operator Page

[AvivAbachi]

✨ New Storybook

• Profile Page:
  • LineProfileDetails
  • LineProfileRide.stories
  • LineProfileStop.stories
• Operator Page:
  • OperatorGaps.stories
  • OperatorInfo.stories
  • OperatorRoutes.stories

🧩 Updated Components

• BusToolTip.tsx:
  • Added Ant Design Skeleton loader for consistent UI.

🛠️ Updated Stories

• Updated story titles for better organization in Storybook.
• Integrated waitForContent utility for improved testing.
• Switched default date arguments to use getPastDate.
• Fix Types with satisfies<typeof SomeComponent>
• Remove tags: ['autodocs'], set by default on .storybook/main.ts
• Fix Sort by alphabetical
• Some refactors

🏷️ Config

• tsconfig.json:
  • Simplified the exclusion pattern for .storybook/* files.

[github-actions]

Preview: https://s3.amazonaws.com/noam-gaash.co.il/15517583404/open-bus/682/index.html
Preview Storybook: https://s3.amazonaws.com/noam-gaash.co.il/15517583404/open-bus/682/storybook/index.html
Test Report (if available): 'https://s3.amazonaws.com/noam-gaash.co.il/15517583404/open-bus/e1d69085441b32cafe9d86d4955eafc9a3120802/test-results/index.html'

[NoamGaash]

Cool! Regarding test stabilization, there are waitBeforeCapture (it can receive a callback async function) and storybook play functions that can be used to take the visual screenshot after the test is stable.
I'll try to play with it today

[AvivAbachi]

is working 🙂
But I think we can do it in a better way on Another fix

[NoamGaash]

Optional comments - (feel free to merge as-is if you prefer to)

[AvivAbachi]

@NoamGaash

1 Storybook play() (Work but need to add for each component)

const meta = {
  ...
  play: waitForContent,
} satisfies Meta<typeof SomeComponent>

2 Storybook Parameters (It is not used in Applitools)

parameters: {
  eyes: {
    waitBeforeCapture: async function () {
      const timeout = 180_000;
      const pollInterval = 100;
      const start = Date.now();

      while (document.querySelector('.ant-skeleton-content')) {
        if (Date.now() - start > timeout) {
          throw new Error('Timeout waiting for skeleton to disappear');
        }
        await new Promise((resolve) => setTimeout(resolve, pollInterval));
      }
    },
  },
}

3 Storybook Parameters (Failed "No Image Content")

parameters: {
  eyes: {
    waitBeforeCapture: waitForContent
  },
}

4 applitools.config.js (It is not used in Applitools)

export default {
  storybookConfigDir: '.storybook',
  async waitBeforeCapture() {
    const timeout = 180_000
    const pollInterval = 100
    const start = Date.now()

    while (document.querySelector('.ant-skeleton-content')) {
      if (Date.now() - start > timeout) {
        throw new Error('Timeout waiting for skeleton to disappear')
      }
      await new Promise((resolve) => setTimeout(resolve, pollInterval))
    }
  },
}

[AvivAbachi]

@NoamGaash
I use the play() function. If it can be set as a global setting, please do so.
It's ready for merge.

[NoamGaash]

Thanks @AvivAbachi !