ui: Sortable loading state

[vladlos]

Added global loading state to sort tables
Added loading state to database tables

Resolves: #46568

Release justification: low risk, high benefit changes to existing functionality

Release note (ui): database loading state design updates

[cockroach-teamcity]

This change is 

[blathers-crl]

❌ The GitHub CI (Cockroach) build has failed on 280fa5e7.

_{🦉 Hoot! I am a Blathers, a bot for CockroachDB. I am experimental - my owner is otan.}

[dhartunian]

Reviewable status: complete! 0 of 0 LGTMs obtained (waiting on @elkmaster)

---

pkg/ui/src/views/databases/containers/databaseTables/index.tsx, line 35 at r1 (raw file):

class DatabaseTableListSortedTable extends SortedTable<TableInfo> {}

class DatabaseTableListEmpty extends React.Component {

it looks like the existing message of "This database has no tables" is removed with this PR. Can we keep that in for databases that in fact, have no tables.

---

pkg/ui/src/views/databases/containers/databaseTables/index.tsx, line 64 at r1 (raw file):

                  sortSetting={sortSetting}
                  onChangeSortSetting={(setting) => this.props.setSort(setting)}
                  loading={!tableInfos}

Did you happen to see if we could access the inFlight property on the cachedData objects? Will this show as "loading" if the response is empty?

[dhartunian]

Reviewed 4 of 6 files at r1, 2 of 2 files at r2.
Reviewable status: complete! 0 of 0 LGTMs obtained (waiting on @dhartunian and @elkmaster)

---

pkg/ui/src/views/databases/containers/databaseSummary/index.tsx, line 120 at r3 (raw file):

// export const isTableFlight = (state: AdminUIState, dbName: string) {

// }

Remove commented code please :)

---

pkg/ui/src/views/shared/components/sortabletable/index.tsx, line 293 at r3 (raw file):

          <div className="table__loading">
            <Spin className="table__loading--spin" indicator={<Icon component={SpinIcon} spin />} />
            <span className="table__loading--label">Loading tables...</span>

This text is specific to the database "Tables". Can we extract the component up to the database tables file? Then it can live next to the "no results" component which I think will help readability.

[dhartunian]

thanks for this last round of changes.

Reviewed 2 of 2 files at r3, 4 of 4 files at r4.
Reviewable status: complete! 1 of 0 LGTMs obtained (waiting on @elkmaster)

[dhartunian]

bors r+

[craig]

Build failed (retrying...)

• GitHub CI (Cockroach)

[craig]

Build succeeded

• GitHub CI (Cockroach)