Merge remote-tracking branch 'origin/master' into fb-lsdv-5044/task-c…

…ount-total

.github/workflows/build.yml

@@ -15,7 +15,7 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: actions/setup-node@v3
       with:
         node-version: "${{ env.NODE }}"

.github/workflows/eslint.yml

@@ -26,7 +26,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
         with:
           fetch-depth: 0
 

.github/workflows/git-command.yml

@@ -19,7 +19,7 @@ jobs:
         run: echo "$PAYLOAD_CONTEXT"
 
       - name: Checkout on chat command
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
         with:
           token: ${{ secrets.GIT_PAT }}
           repository: ${{ github.event.client_payload.pull_request.head.repo.full_name }}

src/components/CellViews/index.js

@@ -11,4 +11,5 @@ export { DateTimeCell as Date, DateTimeCell as Datetime } from "./DateTimeCell";
 export { ImageCell as Image } from "./ImageCell";
 export { NumberCell as Number } from "./NumberCell";
 export { StringCell as String } from "./StringCell";
+export { StringCell as Text } from "./StringCell";
 export { VideoCell as Video } from "./VideoCell";

src/components/Common/SkeletonLoader/SkeletonGap.tsx

@@ -0,0 +1,7 @@
+import { Elem } from '../../../utils/bem';
+
+export const SkeletonGap = ({ height = "4px" }: { height?: string }) => {
+  return (
+    <Elem name='gap' style={{ "--height": height }}/>
+  );
+};

src/components/Common/SkeletonLoader/SkeletonLine.tsx

@@ -0,0 +1,14 @@
+import { Elem } from '../../../utils/bem';
+
+export const SkeletonLine = ({ lineCount = 1, width = "60%", height = "16px" }: { lineCount?: number, width?: string, height?: string }) => {
+  const rows = [];
+
+  for(let i = 0; i < lineCount; i++) {
+    rows.push(<Elem name='line' key={i} style={{ "--line-width": width, "--line-height": height }}/>);
+  }
+  return (
+    <>
+      {rows}
+    </>
+  );
+};