8851019852

Committed 26 Apr 2024 04:00PM UTC coverage: 31.958% (-0.009%) from 31.967%

Build # 8851019852

Build Type

Pull #9186

github

Committed by

oetherington

Commit Message

Persist post list view type in a cookie

Pull Request Pull Request #9186: [EA] Card view

Run Details

4709 of 38529 branches covered (12.22%)

Branch coverage included in aggregate %.

47 of 108 new or added lines in 17 files covered. (43.52%)

7 existing lines in 6 files now uncovered.

27532 of 62355 relevant lines covered (44.15%)

179.82 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

37.04

/packages/lesswrong/components/hooks/usePostsListView.tsx

import React, { FC, ReactNode, createContext, useCallback, useContext, useState } from "react";
import { TupleSet, UnionOf } from "../../lib/utils/typeGuardUtils";
import { useCookiesWithConsent } from "./useCookiesWithConsent";
import { POSTS_LIST_VIEW_TYPE_COOKIE } from "../../lib/cookies/cookies";

const postsListViewTypes = new TupleSet(["list", "card"] as const);

export type PostsListViewType = UnionOf<typeof postsListViewTypes>;

export const isPostsListViewType = (value: string): value is PostsListViewType =>
  postsListViewTypes.has(value);

type PostsListViewContext = {
  view: PostsListViewType,
  setView: (view: PostsListViewType) => void,
}

const postsListViewContext = createContext<PostsListViewContext>({
  view: "list",
  // eslint-disable-next-line
  setView: () => console.error("Can't set view outside of PostsListViewProvider"),
});

const useCookieValue = (): {
  cookieValue: PostsListViewType | null,
    setCookieValue: (value: PostsListViewType) => void,
} => {
  const [cookies, setCookie] = useCookiesWithConsent([POSTS_LIST_VIEW_TYPE_COOKIE]);
  const value = cookies[POSTS_LIST_VIEW_TYPE_COOKIE];
  const setCookieValue = useCallback((newValue: PostsListViewType) => {
    setCookie(POSTS_LIST_VIEW_TYPE_COOKIE, newValue);
  }, [setCookie]);
  return {
    cookieValue: isPostsListViewType(value) ? value : null,
    setCookieValue,
  };
}

export const PostsListViewProvider: FC<{children: ReactNode}> = ({children}) => {
  const {cookieValue, setCookieValue} = useCookieValue();
  const [view, setView_] = useState<PostsListViewType>(cookieValue ?? "list");

  const setView = useCallback((newValue: PostsListViewType) => {
    setView_(newValue);
    setCookieValue(newValue);
  }, [setCookieValue]);

  return (
    <postsListViewContext.Provider value={{view, setView}}>
      {children}
    </postsListViewContext.Provider>
  );
}

export const usePostsListView = () => useContext(postsListViewContext);

1	import React, { FC, ReactNode, createContext, useCallback, useContext, useState } from "react";	3✔
2	import { TupleSet, UnionOf } from "../../lib/utils/typeGuardUtils";	1✔
3	import { useCookiesWithConsent } from "./useCookiesWithConsent";	1✔
4	import { POSTS_LIST_VIEW_TYPE_COOKIE } from "../../lib/cookies/cookies";	1✔
5
6	const postsListViewTypes = new TupleSet(["list", "card"] as const);	1✔
7
8	export type PostsListViewType = UnionOf<typeof postsListViewTypes>;
9
10	export const isPostsListViewType = (value: string): value is PostsListViewType =>	1✔
NEW 11	postsListViewTypes.has(value);	×
12
13	type PostsListViewContext = {
14	view: PostsListViewType,
15	setView: (view: PostsListViewType) => void,
16	}
17
18	const postsListViewContext = createContext<PostsListViewContext>({	1✔
19	view: "list",
20	// eslint-disable-next-line
NEW 21	setView: () => console.error("Can't set view outside of PostsListViewProvider"),	×
22	});
23
24	const useCookieValue = (): {	1✔
25	cookieValue: PostsListViewType \| null,
26	setCookieValue: (value: PostsListViewType) => void,
27	} => {
NEW 28	const [cookies, setCookie] = useCookiesWithConsent([POSTS_LIST_VIEW_TYPE_COOKIE]);	×
NEW 29	const value = cookies[POSTS_LIST_VIEW_TYPE_COOKIE];	×
NEW 30	const setCookieValue = useCallback((newValue: PostsListViewType) => {	×
NEW 31	setCookie(POSTS_LIST_VIEW_TYPE_COOKIE, newValue);	×
32	}, [setCookie]);
NEW 33	return {	×
34	cookieValue: isPostsListViewType(value) ? value : null,	×
35	setCookieValue,
36	};
37	}
38
39	export const PostsListViewProvider: FC<{children: ReactNode}> = ({children}) => {	1✔
NEW 40	const {cookieValue, setCookieValue} = useCookieValue();	×
NEW 41	const [view, setView_] = useState<PostsListViewType>(cookieValue ?? "list");	×
42
NEW 43	const setView = useCallback((newValue: PostsListViewType) => {	×
NEW 44	setView_(newValue);	×
NEW 45	setCookieValue(newValue);	×
46	}, [setCookieValue]);
47
NEW 48	return (	×
49	<postsListViewContext.Provider value={{view, setView}}>
50	{children}
51	</postsListViewContext.Provider>
52	);
53	}
54
55	export const usePostsListView = () => useContext(postsListViewContext);	1✔

ForumMagnum / ForumMagnum / 8851019852

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous